Adding expand / collapse all link to expandable menu

Hello everyone, I'm still pretty new to javascript and require a little help. Basically, I wrote my first script, which was designed for innerHTML, and tann I found a website which showed me a few things. It showed me how to use two links per harder, one shown, one hidden, and they just swap out. The final outcome allows ot to do almost any and everything I want ot to.

First and foremost, here is the script:

function veksle(id,vi){
eclipsed = document.getElementById(id+"co");
enlightened = document.getElementById(id+"ex"); if(
eclipsed.style.display == "block"){
eclipsed.style.display = "none";
enlightened.style.display = "block";} else {
eclipsed.style.display = "block";
enlightened.style.display = "none";}

if(vi){ ljosa(id,vi);}}
function ljosa(id,vi){
for (var i = 0 ; i <vi.length ; i++){if(vi[i] != id){
document.getElementById(vi[i]+"co").style.display = "block";
document.getElementById(vi[i]+"ex").style.display = "none";} } }
var gr = new Array();
gr[gr.length] = "l01";
gr[gr.length] = "l02";

And, in a nutshell, here is the html portion:

<div id="l01co" style="display: block">
<a onclick="veksle('l01',gr)">Show</a></div>

<div id="l01ex" style="display: none">
<a onclick="veksle('l01',gr)">Hide</a>
<ul>
<li>Subset</li>
<li>Subset</li>
</ul>
</div>

<div id="l02co" style="display: block">
<a onclick="veksle('l02',gr)">Show</a></div>

<div id="l02ex" style="display: none">
<a onclick="veksle('l02',gr)">Hide</td></a>
<ul>
<li>Subset</li>
<li>Subset</li>
</ul>
</div>

I've set the menu to only allow one menu opened at a time. Thus, it is prudent to add an expand all link. I've searched all through the web and have found nothing. Any help is much appreciated. As a side note, for anyone who helps me, if you pm me a link to your site I'll credit you as script co-creator.

Bloodhand

Newbie Poster

2 posts since Jan 2010

Reputation Points: 10

Solved Threads: 0

2 Years Ago

0

function showAll() {
    var hDivs = document.getElementsByTagName("div")
      for(var i=0; i<=hDivs.length; i++) {
        if(hDivs[i].style.display = "none"){
        hDivs[i].style.display = "block";
        }
      }
}

<body>  
<a onclick="showAll()">Show All</a>		
...

Maujor

Newbie Poster

5 posts since Jan 2010

Reputation Points: 10

Solved Threads: 1

2 Years Ago

0

Thank you for the help, that works

Bloodhand

Newbie Poster

2 posts since Jan 2010

Reputation Points: 10

Solved Threads: 0

Adding expand / collapse all link to expandable menu

This article has been dead for over three months