Javascript手风琴 - 全部崩溃

时间:2013-01-07 18:51:25

标签: javascript jquery accordion

我已经创建了一个javascript手风琴,当一个手风琴总是打开时会起作用,我想知道如何修改我的代码以便手风琴也可以在再次单击时关闭 - 这样所有手风琴都会折叠?

    $('.accordion-bottom').hide();

    $('.accordion-link').on('click', global.toggleAccordian);

    };

    global.toggleAccordian = function(e){
        var $Arrow = $(this).find('.arrow');
        var $parentDiv = $(this).parent();
        var $bottomAccordion = $parentDiv.siblings('.accordion-bottom');
        var $accordionLi = $parentDiv.parents().eq('1');

        var $siblingLis = $accordionLi.siblings('li');
        var $siblingBotAccordions = $siblingLis.find('.accordion-bottom');
        var $siblingArrows = $siblingLis.find('.arrow');


     $siblingArrows.addClass('arrow-down');

    if (!$accordionLi.hasClass('active')){
        $bottomAccordion.slideDown('slow');
        $Arrow.removeClass('arrow-down');
        $siblingBotAccordions.stop().slideUp('slow');
    }


    e.preventDefault();
    return false;
}

HTML:

<ul class="accordion">
        <li>
           <div class="item-inner-padding accordion-item">
               <div class="accordion-top">
            <a href="#" class="accordion-link">Title<span class="arrow arrow-down">Down</span></a>

               </div>
            <div class="accordion-bottom">

            </div>
            </div>
       </li>
</ul>

0 个答案:

没有答案