I am trying to create a javascript drop down menu. I am using the javascript from this site:
[url]http://www.dynamicdrive.com/dynamicindex1/dropmenuindex.htm
If you go there you will notice an example menu when you hover over the button “Get the news”. The button image changes when the menu is open.
I want to do something like this, but the problem is that my image is one large image and I use CSS to select different parts of it depending on the state.
For instance when there is no hover it would be like
a{
background: url(image.gif) 0px 0px
}
and for hovering:
a:hover{
background: url(image.gif) 0px 50px
}
The image leaves the hovered state when you move off of it and start selecting menu items, unlike the example on the webpage which uses different urls to swap images.
Is there a way I can set the hover state of the image when the menu is open. Any other suggestions?
Thanks.