I'm using a sprite as a background image for a collapsible pane. It
has for states closed off, closed on, open off, open on.
When the pane opens, I want to move the background image so it's in
the 'open off' state, and then, on mouse-over, whos teh 'open on'
state.
I can easily get former to work, but the latter doesn't seem to be
working--at least via the method I'm using:
$(".detailsPaneToggle").children("a").css('background-position','0px -35px');
$(".detailsPaneToggle").children("a:hover").css('background-position','0px
-80px');
Clearly, my made-up syntax for pseudo classes isn't going to work. ;o)
I found that there are mouse-over listeners, but I'm not sure that
will give me what I want, either, as I need to listen for the
mouseover, but also need to know if the panel is open or closed.
Seems the 'gotcha' here is the use of a sprite. I could easily get
around this by just swapping out the background image, but was hoping
there was a clever way to maintain the use of the sprite (as that's
the standard for the site we're working on).
Any suggestions on how to accomplish this? Thanks!
-DA
