I aquired a piece of code for a collapsable HTML menu in which I can just click on an arrow and the contents simply open up below. The code was originally made for only five headings. I can not figure out how to set the code up for more than that.

Here is the JavaScript portion of the code:

<SCRIPT LANGUAGE="JavaScript">

var name = new Array(100);
name[1] = "layer1";
name[2] = "layer2";
name[3] = "layer3";
name[4] = "layer4";
name[5] = "layer5";
function changeArrow(arrow, down) {
if (down == false){
arrow.src = 'rightarr.gif';
}
else{
arrow.src = 'downarr.gif';
}
}

function ToggleHide(value, arrow) {
if (document.layers) {
if (document.layers[name[value]].visibility=='show'){
document.layers[name[value]].visibility='hide';
document.layers[name[value]].height = 1;
changeArrow(arrow,false);
}
else{
document.layers[name[value]].visibility='show';
document.layers[name[value]].height = 50;
changeArrow(arrow,true);
}
}
else {
if (document.all[name[value]].style.visibility == 'visible'){
document.all[name[value]].style.visibility='hidden';
document.all[name[value]].style.height = 1;
document.all[name[value]].style.overflow='hidden';
changeArrow(arrow,false);
}
else{
document.all[name[value]].style.visibility='visible';
document.all[name[value]].style.height = 50;
document.all[name[value]].style.overflow='visible';
changeArrow(arrow,true);
}
}
}
</SCRIPT>


In the body portion of the page, each menu item, or heading in which I would like to collapse gets a code as such:

<p align="left">
<a name="collapse_bookmark1"></a>
<img src="rightarr.gif"
name="arrow1"
onClick="{ToggleHide(1,arrow1) }" width="12" height="12"><B>
Introduction</b></p>
<DIV ID="layer1"
style="position:relative;height:1;overflow:hidden">

<p align="left">The Story of my Life

</p>


<p align="left">
<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="#collapse_bookmark1">
<img src="uparr.gif"
onClick="{ToggleHide(1,arrow1) }" width="12" height="12">
</a></DIV>

The only thing that changes are the numbers. IE, for the second heading, all of the 1's turn into 2's and so on. If anyone can take a look at this code and figure out how I can add more elments, I would greatly appreciate it. I tried to just add more of the name[1] = "layer1"; lines, with differnt numbers, of course, but it didn't work. Thanks