Geekery, Technology

The greybox effect that we use for our images in the project that I was working on had a small flaw. Unfortunately, in IE6 (go figure), drop-down menus were showing through whenever a user had expanded the image on the screen.

This was obviously not desirable.

I couldn’t find exactly what I was looking for on the net so I decided to share my snippet of code with everyone out there in case another person was trying to achieve this (or a similar) effect.

Our code uses a toggle for the grey box stuff so we had to make sure one check would be able to take care of all of the select menus on the page:

var dropDowns = document.getElementsByTagName('select');
for (var ii = 0; ii < dropDowns.length; ii++) {
   if (dropDowns[ii].style.display == 'none') {
      dropDowns[ii].style.display = '';
   } else {
      dropDowns[ii].style.display = 'none';
   }
}

This could be used for any type of tag so hopefully others will be able to use this.

Enjoy!