17488 Posts in 4473 Topics by 1978 members
|
Page:
1
|
Go to End | |
| Author | Topic: | 1224 Views |
-
Menu buttons chaning on Hover when button are images
14 November 2008 at 6:38am
Hi
I have a nav script
<% control Menu(1) %>
<% if LinkOrSection = section %>
<img src="themes/purplewine/images/menu/{$URLSegment}navCurrent.gif" alt="$Title" /><span>$URLSegment</span>
<% else %>
<a href="$Link" title="Go to the $Title.XML page" ><img src="themes/purplewine/images/menu/{$URLSegment}nav.gif" alt="$Title" /><span>$URLSegment</span></a>
<% end_if %>
<% end_control %>This changes the image on the button for the current page but I am having problems getting my head around how to make them change with the mouse. I know I could do this by setting up records in the CSS for each individual button but this menu has sub-menus I would prefer not to have to hardcode it all. Can anyone point in the direction of the right documentation or suggest how to solve this?
Thanks
MM
-
Re: Menu buttons chaning on Hover when button are images
16 November 2008 at 6:26am
I think you can do this with a javascript easily.
<% control Menu(1) %>
<% if LinkOrSection = section %>
<img src="themes/purplewine/images/menu/{$URLSegment}navCurrent.gif" alt="$Title" id="{$URLSegment}" onmouseover="changebg(this, true,'{$URLSegment}navCurrent')" onmouseout="changebg(this, false,'{$URLSegment}nav')" /><span>$URLSegment</span>
<% else %>
<a href="$Link" title="Go to the $Title.XML page" ><img src="themes/purplewine/images/menu/{$URLSegment}nav.gif" alt="$Title" id="{$URLSegment}" onmouseover="changebg(this, true,'{$URLSegment}nav')" onmouseout="changebg(this, false,'{$URLSegment}nav')" /><span>$URLSegment</span></a>
<% end_if %>
<% end_control %>After that add the following code in the header section, between the head tag
<script type="text/javascript">
function changebg(vr img,var mouseup,var image){
if(mouseup){
document.getElementById.(img).src = "themes/purplewine/images/menu/{$URLSegment}navCurrent-mouseup.gif";
}else{
document.getElementById.(img).src = "themes/purplewine/images/menu/{$URLSegment}navCurrent.gif";
}
}</script>
| 1224 Views | ||
|
Page:
1
|
Go to Top |
