Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

I'm failing to get a Javascript to run in Firefox that runs great in IE...need help with debugging.

more options

I'm getting the error below but don't know what to do about it since I can't code Javascript. As I state before, IE runs this code just fine...I can't figure out why Firefox won't let it run. This cascading menu .js is just what I need for a charity website I'm helping to set up. The html portion is also shown below the .js

Error: menu is undefined Source File: file:///C:/Documents%20and%20Settings/Ray/My%20Documents/ECCHS_Website/CascadeMenu.js Line: 8

Here's the code for CascadeMenu.js

   function InitMenu()
   {
     var bar = menuBar.children     
     for(var i=0;i < bar.length;i++) 
        {
          var menu=eval(bar[i].menu)
          menu.style.visibility = "hide"
          bar[i].onmouseover = new Function ("ShowMenu("+bar[i].id+")")
          var Items = menu.children
          for(var j=0; j<Items.length; j++)
            {
              var menuItem = eval(Items[j].id)
                if(menuItem.menu != null)
                   { 
                    menuItem.innerHTML += "<Span Id="+menuItem.id+"_Arrow class='Arrow'>4</Span>"
                    //var tmp = eval(menuItem.id+"_Arrow")
                    // tmp.style.pixelLeft = menu.getBoundingClientRect().Right //- tmp.offsetWidth - 15
                    FindSubMenu(menuItem.menu)}
               
                 if(menuItem.cmd != null) 
                   {
                   menuItem.onclick = new Function("Do("+menuItem.id+")") } 
                   
              menuItem.onmouseover = new Function("highlight("+Items[j].id+")")
            
            }    
        
        }  
   }
   function FindSubMenu(subMenu)
   {
         var menu=eval(subMenu)
         var Items = menu.children
          for(var j=0; j<Items.length; j++)
            {
              menu.style.visibility = "hidden"
              var menuItem = eval(Items[j].id)
              
              
              if(menuItem.menu!= null)
                 {
                    menuItem.innerHTML += "<Span Id="+menuItem.id+"_Arrow class='Arrow'>4</Span>"
                    // var tmp = eval(menuItem.id+"_Arrow")
                    //tmp.style.pixelLeft = 35 //menuItem.getBoundingClientRect().right - tmp.offsetWidth - 15
                    FindSubMenu(menuItem.menu)
                 }

                 if(menuItem.cmd != null) 
                   {
                   menuItem.onclick = new Function("Do("+menuItem.id+")") } 
                  
              menuItem.onmouseover = new Function("highlight("+Items[j].id+")")
                 
            }  
   } 
   function ShowMenu(obj)
   {
     HideMenu(menuBar)
     var menu = eval(obj.menu)
     var bar = eval(obj.id)
     bar.className="barOver"
     menu.style.visibility = "visible"
     menu.style.pixelTop =  obj.getBoundingClientRect().top + obj.offsetHeight + Bdy.scrollTop
     menu.style.pixelLeft = obj.getBoundingClientRect().left + Bdy.scrollLeft
   }
   
   function highlight(obj)
   {
     var PElement = eval(obj.parentElement.id)
     if(PElement.hasChildNodes() == true)
     {  var Elements = PElement.children
       for(var i=0;i<Elements.length;i++)
       {
          TE = eval(Elements[i].id)
          TE.className = "menuItem"
       }
      } 
     obj.className="ItemMouseOver"
     window.defaultStatus = obj.title
     ShowSubMenu(obj)
   }
   
   function Do(obj)
   {
    var cmd = eval(obj).cmd	
    window.navigate(cmd)
     
   }
   
   function HideMenu(obj)
   {
          if(obj.hasChildNodes()==true)
              {  
                 var child = obj.children     
                 
                 for(var j =0;j<child.length;j++)
                  {
                     if (child[j].className=="barOver")
                     {var bar = eval(child[j].id)
                      bar.className="Bar"}
                      
                     if(child[j].menu != null)
                       {
                          var childMenu = eval(child[j].menu)
                          if(childMenu.hasChildNodes()==true) 
                               HideMenu(childMenu)
                          
                           childMenu.style.visibility = "hidden" 
                         }
                  }
              
              }
   }
  function ShowSubMenu(obj)
  {
     PMenu = eval(obj.parentElement.id)
      HideMenu(PMenu)
     if(obj.menu != null)
     {
     var menu = eval(obj.menu)
     menu.style.visibility = "visible"
     menu.style.pixelTop =  obj.getBoundingClientRect().top + Bdy.scrollTop
     menu.style.pixelLeft = obj.getBoundingClientRect().right + Bdy.scrollLeft
     if(menu.getBoundingClientRect().right > window.screen.availWidth )
       menu.style.pixelLeft = obj.getBoundingClientRect().left - menu.offsetWidth
    }
  } 





 ///////////////////CascadedDropdown Menu/////////////////
 //Date : 08/09/2001               						//
 //Version : 1.0        								//
 //Author Mr.Arun N Kumar	                            //
 //EMail: n_arunk@hotmail.com							//		
 /////////////////////////////////////////////////////////
 // Modifications on this code is not recomended
 // Suggestions are welcome

<html>
<head>

<link href="CascadeMenu.css" rel="stylesheet">
<script language="javascript" src="CascadeMenu.js">
</script>

</head>

<body OnLoad="InitMenu()" 

Onclick="HideMenu(menuBar)" ID="Bdy" 

bgColor=aliceblue>

<font color="#6B8174"><b>          East Contra Costa 

Historical<br>Society Content Menus</b></font><div 

align="center">          
<DIV Id="menuBar" class="menuBar" >
    <DIV Id="Bar1" class="Bar"  menu="menu1">Menu 

#1</DIV>
    <DIV Id="Bar2" class="Bar"  menu="menu2">Menu 

#2</DIV>
    <DIV Id="Bar3" class="Bar"  menu="menu3">Menu 

#3</DIV>
    <DIV Id="Bar4" class="Bar"  menu="menu4">Menu 

#4</DIV></center>
</DIV>
<!--MenuItem Definition -->
<div Id="menu1" class="menu" >
   <div Id="menuItem1_1" class="menuItem"  

menu="menu6">SubMenu 
#1</div>
   <div Id="menuItem1_2" class="menuItem" 

title="JavaScripts" 
cmd="http://javascript.internet.com/">JavaScript 

Source</div>
   <div Id="menuItem1_3" class="menuItem" 

title="WDVL" 
cmd="http://www.wdvl.com">WDVL</div>
</div>
<div Id="menu2" class="menu">
   <div Id="menuItem2_1" class="menuItem">Page 

#1</div>
   <div Id="menuItem2_2" class="menuItem">Page 

#2</div>
   <div Id="menuItem2_3" class="menuItem">Page 

#3</div>
</div>
<div Id="menu3" class="menu">
   <div Id="menuItem3_1" class="menuItem">Page 

#1</div>
   <div Id="menuItem3_2" class="menuItem">Page 

#2</div>
   <div Id="menuItem3_3" class="menuItem">Page 

#3</div>
   <div Id="menuItem3_4" class="menuItem" 

menu="menu5">SubMenu 
#4</div>
</div>
<div Id="menu4" class="menu">
   <div Id="menuItem4_1" class="menuItem">Page 

#1</div>
   <div Id="menuItem4_2" class="menuItem">Page 

#2</div>
   <div Id="menuItem4_3" class="menuItem">Page 

#3</div>
   <div Id="menuItem4_4" class="menuItem">Page 

#4</div>
</div>
<div id="menu5" class="menu">
    <div Id="menuItem5_1" class="menuItem">Page 

#4-1</div>
    <div Id="menuItem5_2" class="menuItem">Page 

#4-2</div>
    <div Id="menuItem5_3" class="menuItem">Page 

#4-3</div>
</div>
<div id="menu6" class="menu">
    <div Id="menuItem6_1" class="menuItem">Page 

#1-1</div>
    <div Id="menuItem6_2" class="menuItem">Page 

#1-2</div>
    <div Id="menuItem6_3" class="menuItem" 

menu="menu7">SubMenu 
#1-1</div>
</div>
<div id="menu7" class="menu">
    <div Id="menuItem7_1" class="menuItem">Page 

#1-1-1</div>
    <div Id="menuItem7_2" class="menuItem">Page 

#1-1-2</div>
    <div Id="menuItem7_3" class="menuItem">Page 

#1-1-3</div>
</div><!-- End of Menu --><br>

</body>
</html>
I'm getting the error below but don't know what to do about it since I can't code Javascript. As I state before, IE runs this code just fine...I can't figure out why Firefox won't let it run. This cascading menu .js is just what I need for a charity website I'm helping to set up. The html portion is also shown below the .js Error: menu is undefined Source File: file:///C:/Documents%20and%20Settings/Ray/My%20Documents/ECCHS_Website/CascadeMenu.js Line: 8 Here's the code for CascadeMenu.js <pre><nowiki> function InitMenu() { var bar = menuBar.children for(var i=0;i < bar.length;i++) { var menu=eval(bar[i].menu) menu.style.visibility = "hide" bar[i].onmouseover = new Function ("ShowMenu("+bar[i].id+")") var Items = menu.children for(var j=0; j<Items.length; j++) { var menuItem = eval(Items[j].id) if(menuItem.menu != null) { menuItem.innerHTML += "<Span Id="+menuItem.id+"_Arrow class='Arrow'>4</Span>" //var tmp = eval(menuItem.id+"_Arrow") // tmp.style.pixelLeft = menu.getBoundingClientRect().Right //- tmp.offsetWidth - 15 FindSubMenu(menuItem.menu)} if(menuItem.cmd != null) { menuItem.onclick = new Function("Do("+menuItem.id+")") } menuItem.onmouseover = new Function("highlight("+Items[j].id+")") } } } function FindSubMenu(subMenu) { var menu=eval(subMenu) var Items = menu.children for(var j=0; j<Items.length; j++) { menu.style.visibility = "hidden" var menuItem = eval(Items[j].id) if(menuItem.menu!= null) { menuItem.innerHTML += "<Span Id="+menuItem.id+"_Arrow class='Arrow'>4</Span>" // var tmp = eval(menuItem.id+"_Arrow") //tmp.style.pixelLeft = 35 //menuItem.getBoundingClientRect().right - tmp.offsetWidth - 15 FindSubMenu(menuItem.menu) } if(menuItem.cmd != null) { menuItem.onclick = new Function("Do("+menuItem.id+")") } menuItem.onmouseover = new Function("highlight("+Items[j].id+")") } } function ShowMenu(obj) { HideMenu(menuBar) var menu = eval(obj.menu) var bar = eval(obj.id) bar.className="barOver" menu.style.visibility = "visible" menu.style.pixelTop = obj.getBoundingClientRect().top + obj.offsetHeight + Bdy.scrollTop menu.style.pixelLeft = obj.getBoundingClientRect().left + Bdy.scrollLeft } function highlight(obj) { var PElement = eval(obj.parentElement.id) if(PElement.hasChildNodes() == true) { var Elements = PElement.children for(var i=0;i<Elements.length;i++) { TE = eval(Elements[i].id) TE.className = "menuItem" } } obj.className="ItemMouseOver" window.defaultStatus = obj.title ShowSubMenu(obj) } function Do(obj) { var cmd = eval(obj).cmd window.navigate(cmd) } function HideMenu(obj) { if(obj.hasChildNodes()==true) { var child = obj.children for(var j =0;j<child.length;j++) { if (child[j].className=="barOver") {var bar = eval(child[j].id) bar.className="Bar"} if(child[j].menu != null) { var childMenu = eval(child[j].menu) if(childMenu.hasChildNodes()==true) HideMenu(childMenu) childMenu.style.visibility = "hidden" } } } } function ShowSubMenu(obj) { PMenu = eval(obj.parentElement.id) HideMenu(PMenu) if(obj.menu != null) { var menu = eval(obj.menu) menu.style.visibility = "visible" menu.style.pixelTop = obj.getBoundingClientRect().top + Bdy.scrollTop menu.style.pixelLeft = obj.getBoundingClientRect().right + Bdy.scrollLeft if(menu.getBoundingClientRect().right > window.screen.availWidth ) menu.style.pixelLeft = obj.getBoundingClientRect().left - menu.offsetWidth } } ///////////////////CascadedDropdown Menu///////////////// //Date : 08/09/2001 // //Version : 1.0 // //Author Mr.Arun N Kumar // //EMail: n_arunk@hotmail.com // ///////////////////////////////////////////////////////// // Modifications on this code is not recomended // Suggestions are welcome <html> <head> <link href="CascadeMenu.css" rel="stylesheet"> <script language="javascript" src="CascadeMenu.js"> </script> </head> <body OnLoad="InitMenu()" Onclick="HideMenu(menuBar)" ID="Bdy" bgColor=aliceblue> <font color="#6B8174"><b> East Contra Costa Historical<br>Society Content Menus</b></font><div align="center"> <DIV Id="menuBar" class="menuBar" > <DIV Id="Bar1" class="Bar" menu="menu1">Menu #1</DIV> <DIV Id="Bar2" class="Bar" menu="menu2">Menu #2</DIV> <DIV Id="Bar3" class="Bar" menu="menu3">Menu #3</DIV> <DIV Id="Bar4" class="Bar" menu="menu4">Menu #4</DIV></center> </DIV> <!--MenuItem Definition --> <div Id="menu1" class="menu" > <div Id="menuItem1_1" class="menuItem" menu="menu6">SubMenu #1</div> <div Id="menuItem1_2" class="menuItem" title="JavaScripts" cmd="http://javascript.internet.com/">JavaScript Source</div> <div Id="menuItem1_3" class="menuItem" title="WDVL" cmd="http://www.wdvl.com">WDVL</div> </div> <div Id="menu2" class="menu"> <div Id="menuItem2_1" class="menuItem">Page #1</div> <div Id="menuItem2_2" class="menuItem">Page #2</div> <div Id="menuItem2_3" class="menuItem">Page #3</div> </div> <div Id="menu3" class="menu"> <div Id="menuItem3_1" class="menuItem">Page #1</div> <div Id="menuItem3_2" class="menuItem">Page #2</div> <div Id="menuItem3_3" class="menuItem">Page #3</div> <div Id="menuItem3_4" class="menuItem" menu="menu5">SubMenu #4</div> </div> <div Id="menu4" class="menu"> <div Id="menuItem4_1" class="menuItem">Page #1</div> <div Id="menuItem4_2" class="menuItem">Page #2</div> <div Id="menuItem4_3" class="menuItem">Page #3</div> <div Id="menuItem4_4" class="menuItem">Page #4</div> </div> <div id="menu5" class="menu"> <div Id="menuItem5_1" class="menuItem">Page #4-1</div> <div Id="menuItem5_2" class="menuItem">Page #4-2</div> <div Id="menuItem5_3" class="menuItem">Page #4-3</div> </div> <div id="menu6" class="menu"> <div Id="menuItem6_1" class="menuItem">Page #1-1</div> <div Id="menuItem6_2" class="menuItem">Page #1-2</div> <div Id="menuItem6_3" class="menuItem" menu="menu7">SubMenu #1-1</div> </div> <div id="menu7" class="menu"> <div Id="menuItem7_1" class="menuItem">Page #1-1-1</div> <div Id="menuItem7_2" class="menuItem">Page #1-1-2</div> <div Id="menuItem7_3" class="menuItem">Page #1-1-3</div> </div><!-- End of Menu --><br> </body> </html></nowiki></pre>

cor-el trɔe

All Replies (1)

more options

I found a download of Cascade Menu with files from 2001. I also found a discussion thread as of 2006 indicating problems with the script in Firefox as of that time (Menubar Script problem in FireFox [Archive - WebDeveloper.com]). The web and web browsers have changed a lot during the past decade, so you might find it more efficient to get a new menu script than to fix this old one. (It might not even work in IE9 any more...)