...

Help with expand/collapse accordion style javascript

optimus203
09-02-2008, 02:25 AM
Hey everyone. I am a fresh newbie to this forum. I was hoping someone can help me complete the following JS code to fulfill the needs for one of my sites. Currently, this code shows a hidden div containing content. The only problem is that it doesn't collapse the content upon clicking a new link. You have to manually click the original link a second time to collapse the content. Does anyone know how I can finish this code so that content1 will automatically collapse when content2 is called??? Here is the code:

JS
function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block"
} else {
e.style.display="none"
}
return true;
}

Related HTML (<p>idname = a general file name for each link)
<input type="button" class="button" onclick="return toggleMe('<p>idname')" value="<p>idname" />
<div id="<p>idname" style="display:none">

Here is the link to the page in question. The top 4 links in the right nav have the expand command working, and manual collapse command working.
http://www.db-elements.com/ahimsa/blake_babies/index_w_js2.html

Any ideas are greatly appreciated. Thanks in advance.

Dave

abduraooft
09-02-2008, 04:59 AM
Validate your markup and fix all errors first, see http://validator.w3.org/check?uri=http%3A%2F%2Fwww.db-elements.com%2Fahimsa%2Fblake_babies%2Findex_w_js2.html&charset=%28detect+automatically%29&doctype=Inline&group=0

rangana
09-02-2008, 07:45 AM
For your problem, try to add highlighted:

function toggleMe(a){
var e=document.getElementById(a);
for(var i=0,divs=document.getElementById('containerLyrics').getElementsByTagName('div');i<divs.length;i++)
divs[i].style.display='none';
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block"
} else {
e.style.display="none"
}
return true;
}


Hope it helps.

optimus203
09-02-2008, 11:41 PM
Yes rangana! That works perfectly, from what I can see. Thanks so much for your help in resolving this matter. All the other solutions people presented on other forums were a lot more work than this addition of your. I'm been trying to wrap my head around the easiest way to approach this issue, and this is it. Respectfully, Dave



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum