I have a collapsing expanding menu I want to collapse before the
images load on the page. I was able to do this with the $document
ready command. Only problem is ....

In FF3 menu collapses immediately...once all images are loaded the
menu expands again ... :(
In IE6 works
In IE7 menu never collapses

Using onpageload produces varied results as well loading the script
after all the slow images...and sometimes in IE7 the menu doesn't
collapse.

here is the page

http://www.ryanvosburg.com/portfolio/blackcreek/indexdom.html

here is the code

var toggleMenu = {


        init : function(sContainerClass, sHiddenClass) {
                var arrMenus = this.getElementsByClassName(document, 'ul',
sContainerClass);
                var arrSubMenus, oSubMenu, oLink;
                for (var i = 0; i < arrMenus.length; i++) {
                        arrSubMenus = arrMenus[i].getElementsByTagName('ul');
                        for (var j = 0; j < arrSubMenus.length; j++) {
                                oSubMenu = arrSubMenus[j];
                                oLink = 
oSubMenu.parentNode.getElementsByTagName('a')[0];
                                oLink.onclick = function(){toggleMenu.toggle
(this.parentNode.getElementsByTagName('ul')[0], sHiddenClass); return
false;}
                                this.toggle(oSubMenu, sHiddenClass);
                        }
                }
        },
        toggle : function(el, sHiddenClass) {
                var oRegExp = new RegExp("(^|\\s)" + sHiddenClass + "(\\s|$)");
                el.className = (oRegExp.test(el.className)) ? 
el.className.replace
(oRegExp, '') : el.className + ' ' + sHiddenClass; // Add or remove
the class name that hides the element
        },
        addEvent : function(obj, type, fn) {
                if (obj.addEventListener)
                        obj.addEventListener(type, fn, false);
                else if (obj.attachEvent) {
                        obj["e"+type+fn] = fn;
                        obj[type+fn] = function() 
{obj["e"+type+fn](window.event);}
                        obj.attachEvent("on"+type, obj[type+fn]);
                }
        },
        getElementsByClassName : function(oElm, strTagName, strClassName){
            var arrElements = (strTagName == "*" && document.all)?
document.all : oElm.getElementsByTagName(strTagName);
            var arrReturnElements = new Array();
            strClassName = strClassName.replace(/\-/g, "\\-");
            var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
            var oElement;
            for(var i=0; i<arrElements.length; i++){
                oElement = arrElements[i];
                if(oRegExp.test(oElement.className)){
                    arrReturnElements.push(oElement);
                }
            }
            return (arrReturnElements)
        }
};

$(document).ready(function () {
toggleMenu.addEvent(window, 'load', function(){toggleMenu.init
('menu','hidden');});

if (document.addEventListener)
  document.addEventListener("DOMContentLoaded", toggleMenu.init
('menu','hidden'), false)

});

Reply via email to