Vladimir Ch Vladimir Ch - 5 months ago 10
Javascript Question

make accordion for specific ids

I want to create accordion for some specific blocks with ID.

1 when i click on some li > a href=#ID
2 all child in div#content with specified IDs are closing
3 show div#content div#ID

content:

<div id='body'>
<div id='content'>
<div id='home'>
some for home blocks
content
</div>
<div id='news'>
some for news blocks
content
</div>
<div id='sub_news'>
some for sub news blocks
content that will always displayed
</div>
<div id='work'>
some for work blocks
content
</div>
<div id='contacts'>
some for contacts blocks
content
</div>
<div id='contacts2'>
some for contacts2 blocks
content that will display too
</div>
</div>
</div>


navigation:

<ul id='navigation_1'>
<li id='li_1_home' class='nav_current_li_1 first'><a class='replace' href='#home' id='navigation_1_news' title='link to gome'>go home<span></span></a>
</li>
<li id='li_1_news'><a class='replace' href='#news' id='navigation_1_news' title='news'>news<span></span></a>
</li>
<li id='li_1_work'><a class='replace' href='#work' id='navigation_1_raboty' title='some work'>some work<span></span></a>
</li>
<li id='li_1_some'><a class='replace' href='http://google.com' id='navigation_1_link' title='some link'>some link<span></span></a>
</li>
<li class='last' id='li_1_contact'><a class='replace' href='#contacts' id='navigation_1_contact' title='some contacts'>Contacts<span></span></a>
</li>
</ul>


i don't need a function for every a href and divs
and i need only specific IDs, not everylink in #navigation_1 > li a !

i think mb need some database with div#id that will be toggled to

Answer

Tempory worked, thx from jQuery .not(), multiple excludes with id

$('#navigation_1 li a').click(function(e) {
    //e.preventDefault(); //for move to anchors
  $( $(this).attr('href') ).slideToggle('slow'); //Expand or collapse this blocks
  $("#content > div").not( $(this).attr('href')', #sub_news, #contacts, #contacts2').slideUp('fast'); //Hide the other blocks
})  
Comments