 
      /* Son of Suckerfish Dropdowns. JS needed only for
   
        Internet Explorer. Documented here:
 
        http://www.htmldog.com/articles/suckerfish/dropdowns/*/
  
      sfHover = function() {
  
      var sfEls = document.getElementById("nav").getElementsByTagName("LI");
 
      /* Create an array of all <select> tags on the page (could be limited to
  
        those within an element with a specific id -- see line above. */
 
      var selects = document.getElementsByTagName("select");
   
      for (var i=0; i<sfEls.length; i++) {

      sfEls[i].onmouseover=function() {
 
      this.className+=" sfhover";
  
      for (var n=0; n<selects.length; n++) {
  
      /* Hides <select> tags, which appear above menu in IE */

      selects[n].className+=" hide_select";

      }
  
      }

      sfEls[i].onmouseout=function() {
  
      this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
 
      for (var n=0; n<selects.length; n++) {
  
      /* Makes <select> tags visible again */

      selects[n].className = selects[n].className.replace(new RegExp(" hide_select\\b"), "");

      }
  
      }
 
      }
 
      }

       

      /*

       * NOTE: In order for this snippet to work, you need to add the
 
       * following lines (or something similar) to your CSS:
  
       *

       * select.hide_select {
 
       * visibility: hidden;

       * }

       *

       * Using "display: none" may cause other elements to shift as the is

       * completely removed from the flow of the document. By using

       * "visibility: hidden", the just becomes "invisible."
  
       */