dropdown list

I haven't figured this one out yet. css3 animation isn't working for some reason.


img select

by default, HTML (or maybe the browser) doesn't allow this. but you can coax the browser with some javascript. wonder if it works on all browsers. you will notice that the select box is bigger than normal! this is because I set the image size to '24px' in the function call.

you will also notice that I have not found any way to make the browser display the image on the currently selected item. I don't understand this except that maybe firefox is forcing it into text-only and stripping out any extraneous elements like a filter during display. I know of no workaround yet. the guy who might is not talking.

this javascript node insertion method does not work in opera, safari, IE, Chrome. only works in FF.

attempt #2 at image select using css bg

this was suggested here. blah. don't like the results. same problems as above.

this CSS method does not work in opera, safari, IE, Chrome. only works in FF.

attempt #2 at ul li img list

this is from dynamicdrive.com, and their CSS needed a LOT of help. it probably won't view well in IE8 and below, since it needs an image background to get gradients. otherwise, it's just transparent. but hey - it works! and you can categorize!

  • the menus are SUPPOSED to drop down one at a time as you hover over the a given menu item. but it doesn't work that way
  • also, it is supposed to stay up for about 0.5-1 second if the mouse cursor comes off.
  • and if you move the cursor left, rightmost menu which is mouseoff individually closes.