sfHover = function() {
    // attach this functionality to every <li> in the nav,
    // to make the drop-downs work (kind of) in exploder
    var sfEls = document.getElementById("nav").getElementsByTagName("LI");
    for (var i=0; i<sfEls.length; i++) {
        
        // when the mouse is hovering over this element, add
        // the 'hover' and 'hover-first' classes. add support
        // for hover-last?
        sfEls[i].onmouseover=function() {
            this.className += " sfhover";
            if(this.className.match(new RegExp("first"))) this.className += " sfhover-first"
            if(this.className.match(new RegExp("last")))  this.className += " sfhover-last"
        }
        
        // when the mouse leaves, remove both the 'hover'
        // class, and the 'hover-first' class
        sfEls[i].onmouseout = function() {
            this.className = this.className.
                replace(new RegExp(" sfhover-last\\b"), "").
                replace(new RegExp(" sfhover-first\\b"), "").
                replace(new RegExp(" sfhover\\b"),       "");
        }
    }
}

if (window.attachEvent) window.attachEvent("onload", sfHover);