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.

Re: Adding expand / collapse all link to expandable menu 80 80
Member Avatar
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>		
...
Re: Adding expand / collapse all link to expandable menu 80 80

Thank you for the help, that works

Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.19 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.