Go Back   CodingForums.com > :: Client side development > JavaScript programming > JavaScript frameworks

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 09-02-2008, 02:25 AM   PM User | #1
optimus203
Regular Coder

 
optimus203's Avatar
 
Join Date: Sep 2008
Location: CT
Posts: 316
Thanks: 22
Thanked 16 Times in 15 Posts
optimus203 is an unknown quantity at this point
Help with expand/collapse accordion style javascript

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/bl...dex_w_js2.html

Any ideas are greatly appreciated. Thanks in advance.

Dave
optimus203 is offline   Reply With Quote
Old 09-02-2008, 04:59 AM   PM User | #2
abduraooft
Supreme Master coder!

 
abduraooft's Avatar
 
Join Date: Mar 2007
Location: N/A
Posts: 14,680
Thanks: 158
Thanked 2,182 Times in 2,169 Posts
abduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really nice
Validate your markup and fix all errors first, see http://validator.w3.org/check?uri=ht...Inline&group=0
__________________
Quote:
The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)
abduraooft is offline   Reply With Quote
Old 09-02-2008, 07:45 AM   PM User | #3
rangana
Senior Coder

 
rangana's Avatar
 
Join Date: Feb 2008
Location: Cebu City, Philippines
Posts: 1,752
Thanks: 65
Thanked 372 Times in 365 Posts
rangana will become famous soon enoughrangana will become famous soon enough
For your problem, try to add highlighted:
Code:
	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.
__________________
Learn how to javascript at 02geek

The more you learn, the more you'll realize there's much more to learn
Ray.ph
rangana is offline   Reply With Quote
Users who have thanked rangana for this post:
optimus203 (09-04-2008)
Old 09-02-2008, 11:41 PM   PM User | #4
optimus203
Regular Coder

 
optimus203's Avatar
 
Join Date: Sep 2008
Location: CT
Posts: 316
Thanks: 22
Thanked 16 Times in 15 Posts
optimus203 is an unknown quantity at this point
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
optimus203 is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 03:04 AM.


Advertisement
Log in to turn off these ads.