Question about Jquery accordion activate
Hi everyone,
I have a requirement where I need to collapse and expand all the
accordions. I know its not possible to do it directly using jquery
accordion. My approach to achieve that is by having three accordions
sets(with one accordion in it) as shown below, and I am using $
('.section').accordion('activate', -1) to collapse all my accordions
and I am using $('.section').accordion('activate', 0) to expand them.
The collapse works fine, but the expand is not working as I expect it
to, it works like a toggle (if an accordian is open it closes it and
opens the ones which are closed).
I am trying to fix that toggle like behavior, so, can someone please
show/guide me how to expand all and remove the toggling behavior.
javascript:
$(function(){
// Accordion
$("#accordion1, #accordion2, #accordion3").accordion
({collapsible:true});
$("#expand").click(function(){
$(".datkSection").accordion('activate', 0)
});
$("#collapse").click(function(){
$(".datkSection").accordion('activate', -1);
});
});
html:
<div align="center">
<span id="collapse">Collapse All -</span> |
<span id="expand">Expand All +</span>
</div>
<div id="accordion1" class="section">
<div>
<h3><a href="#">First</a></h3>
<div>Lorem ipsum dolor sit amet. </div>
</div>
</div>
<div id="accordion2" class="section">
<div>
<h3><a href="#">Second</a></h3>
div>Phasellus mattis tincidunt nibh.</div>
</div>
</div>
<div id="accordion3" class="section">
<div>
<h3><a href="#">Third</a></h3>
<div>Nam dui erat, auctor a, dignissim quis.</div>
</div>
</div>
Thanks
Ash