Click to See Complete Forum and Search --> : Tree menu script - display specific elements on load


ambolina
06-03-2004, 02:15 PM
Hi there,

The below code is for a menu that functions similar to a tree menu. You click on a main menu item and it shows all the sub menu items under it.

I'd like to add a function so that it displays a particular submenu set on page load. I don't write javascript (I got this off www.dynamicdrive.com). I can locate where the display is set to "none" in the script, but when I try and change it to one of the submenu variables, it just ends up displaying the all the submenus instead of just the one I specify.

Do I need a whole new function for this, or is there just some line of code I can add? Any help would be appreciated. I know this is pretty standard function, but the search terms I knew to try didn't pull anything.

This is the entire code, where "sidemenu" is the element I want to display a specific instance of (sub3)
if (document.getElementById){ //DynamicDrive.com change
document.write('<style type="text/css">\n')
document.write('.sidemenu{display: none;}\n')
document.write('</style>\n')
}

function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
if(el.style.display != "block"){ //DynamicDrive.com change
for (var i=0; i<ar.length; i++){
if (ar[i].className=="sidemenu") //DynamicDrive.com change
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}

This is part of the code in the HTML. The onclick function. But I want it to start open so they don't have to click.


<div class="sidemenutitle" onclick="SwitchMenu('sub3')">Main Menu Item</div>
<span class="sidemenu" id="sub3">
Option 1 <br>
Option 2 <br>
Option 3<br>
</span>

Thanks for any help!

Virbatem
06-03-2004, 05:36 PM
If you want sub3 to open when the page loads then open sub3 when the page loads:


<body onload="SwitchMenu('sub3');">

ambolina
06-03-2004, 05:40 PM
Thank you! Thank you! I knew it had to be something easy like that. I love learning new things - I always forget about the onload option for the body tag.

ambolina
06-07-2004, 07:09 PM
Are you allowed to put to onload events in the body tag? Because now the onload for the side menu (from the above post) is overriding the onload for a function for my dropdown main menu (now those dropdowns don't work on pages where I use the onload for the side menu). This is the function the other onload calls:



function init()
{
cssjsmenu('navbar');
if (document.getElementById)
{

}
}



Let me know if that's not enough code to be useful. Thanks!

Virbatem
06-07-2004, 08:06 PM
Yes but it depends on how you structured your code:

<body onload="init1(); init2();">

This is correct. having onload="" onload="" is wrong.

ambolina
06-08-2004, 10:40 AM
thanks again!