Simple accordion menu (jQuery)

Posted by Nimbuz on Stack Overflow See other posts from Stack Overflow or by Nimbuz
Published on 2010-03-18T09:03:49Z Indexed on 2010/03/18 9:11 UTC
Read the original article Hit count: 122

Filed under:
|
|
|
|
// ACCORDION
$('.accordion .answer').hide(); // hide all
$('.accordion .question').click(function(){
        $('.accordion .answer').slideUp(); // hide all open
        $(this).addClass('active').next().slideDown(); // show the anwser
        return false;
});

HTML:

<dl class="accordion">
    <dt class="question">question</dt>
    <dd class="answer">answer</dd>
    <dt class="question">question</dt>
    <dd class="answer">answer</dd>
</dl>

... works, but

  • the 'active' class is removed from inactive question elements and
  • atleast one of the answer remains open, all answers should be able to close.

Thanks!

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about jQuery