ok. I have been trying to make a drop down menu with nothing but images. (I cannot use text - because it needs to be "unsearable" in Ebay's search)

I found some code and it seems to work well. I click on the "button" and my image drops down (which I have mapped to various links). If you mouse out the image stays down. Good. However, I need it to close by clicking on the button....and I can't seem to figure that out.
This is in my header:
<style type="text/css">
#menu1 { display : none }
#menu2 { display : none }
#menu3 { display : none }
</style>
Here's my code:
<SPAN onClick="document.all.menu2.style.display = 'block'" oonmouseout="document.all.menu2.style.display = 'block'">
<b><IMG SRC="file:///C:/Documents%20and%20Settings/Doug%20&%20Erin%20Cannon/Desktop/menu/b2.jpg" width="174" height="26"> </b></SPAN><BR>
<SPAN ID="menu2" onClick="document.all.menu2.style.display = 'none'">

(then i have my mapped image) </span>

Any ideas on this would be great....also if I've done anything wrong above...it was just a copy/paste and figure it out from there. (The images are all still on my harddrive while I test.)