I am working on implementing a gallery into my website with categories that collapse/expand the set of images within those categories.
i figured out mostly everything i need except i can't get the BUTTONS to behave the way that I want.
I'm working with the following images:
in general, I want "arrow1" to change to "arrow2" whenever you hover a mouse over it, and back to "arrow1" when the mouse is moves away. (which is simple by itself)
the complicated part that I can't figure out, is what happens when you CLICK the button. I want the image to change to "arrow3" when it is clicked (because the content expands), and to STAY at that image until it's clicked again, at which point it should behave as what I started with. The problem is, I can get the arrow to change on click no problem, but once the mouse is moved away, the "onMouseOut" effect changes it back to "arrow1".
this is the code I'm working with, hope someone can help
<td valign="top" width="15">
<div id="div1" style="display: none;">imgset1</div>