Expand/collapse script problem

[sorenchr]

Hi, I'm currently using an expand/collapse script for my website, however, it seems that it is expanded by default. Now, I know absolutely nothing about javascript, so i was wondering if any of you could help me to get it collapsed by default

The script:

<script langauge="JavaScript" type="text/javascript">
function doMenu(item) {
obj=document.getElementById(item);
col=document.getElementById("x" + item);
if (obj.style.display=="none") {
obj.style.display="block";
}
else {
obj.style.display="none";
}
}
</script>

<a href="javascript:doMenu('main');" id=xmain> Main Item</a>
<div id=main style="margin-left:0em">hi there</div>

 

[13sio]

Try

<div id="main" style="margin-left:0em; [b]display:none;[/b]">hi there</div>

 

[sorenchr]

Thanks! Works like a charm

 

[sorenchr]

However, if i have several Menu items, like so:


<a href="javascript:doMenu('main');" id=xmain> Main Item</a>
<div id=main style="margin-left:0em; display:none;"> 1 </div> <br>

<a href="javascript:doMenu('main2');" id=xmain2> Main2 Item</a>
<div id=main2 style="margin-left:0em; display:none;"> 2 </div> <br>

<a href="javascript:doMenu('main');" id=xmain3> Main3 Item</a>
<div id=main3 style="margin-left:0em; display:none;"> 3 </div> <br>

<a href="javascript:doMenu('main2');" id=xmain4> Main4 Item</a>
<div id=main4 style="margin-left:0em; display:none;"> 4 </div> <br>

How do i allow the script to have a maximum of 1 expanded menu items? So that it closes any other menu items if you click on a new one.

I create the menu items with php, so the number of menu items are dynamic.

 

[sorenchr]

Minor change to the code:

<a href="javascript:doMenu('main');" id=xmain> Main Item</a>
<div id=main style="margin-left:0em; display:none;"> 1 </div> <br>

<a href="javascript:doMenu('main2');" id=xmain2> Main2 Item</a>
<div id=main2 style="margin-left:0em; display:none;"> 2 </div> <br>

<a href="javascript:doMenu('main3');" id=xmain3> Main3 Item</a>
<div id=main3 style="margin-left:0em; display:none;"> 3 </div> <br>

<a href="javascript:doMenu('main4');" id=xmain4> Main4 Item</a>
<div id=main4 style="margin-left:0em; display:none;"> 4 </div> <br>