Question

I am creating sliding menus in JavaScript, and the following is my init() function:

function init() {
   var menus = new Array();
   var allElems = document.getElementsByTagName("*");

   for (var i = 0; i < allElems.length; i++) {
      alert(allElems[i]);
      if (allElems[i].className == "navG") {
      alert(allElems[i]);
      menus.push(allElems[i]); 
      }
   }

   /* assign the openMenu function to the onclick event for each
      Menus item */
    for (var i = 0; i < menus.length; i++) {
       alert(menus[i]);
       menus[i].onclick=openMenu;
    }

    document.getElementById("logo").onclick = closeMenu;
    document.getElementById("linkList").onclick = closeMenu;
    document.getElementById("main").onclick = closeMenu;
}

The problem seems to be in the first for loop. This is definitely the correct class name..just for reference, this is the type of HTML that I am referring to:

<div class="navG" id="gallery1" style="position: absolute; top: 180px; left: -150px; " >

Is there an obvious, or not so obvious reason, that this is not adding the elements to menus?

Answer 1

In the page you linked to, in your family.js script, this line:

window.onLoad = init();

says to run the init function immediately and assign its return value to window.onLoad. Because it is running immediately the actual document hasn’t been parsed yet so it doesn’t find any of your elements. You need to say this:

window.onload = init;

which assigns a reference to the init function to window.onload so that that function will be run later after all of the elements have been parsed.

Also onload should have a lowercase l.

(There are some other problems in your code, e.g., you don’t seem to have elements with the ids "linkList" or "main", but I think what I said above is the main problem with the part you are asking about.)