3
\$\begingroup\$

I'm using a very lightweight jQuery accordion with some tweaks and it's working nicely. Is there anything to improve?

JS

;(function($, doc, win) {
    "use strict";

    $.fn.accordionLite = function(){

        var sections = this.children(),
            trigger = sections.find('.accordion_trigger'),
            allContent = sections.find('.accordion_content');

        allContent.hide();
        $('.accordion_trigger.active').next('.accordion_content').show();

        trigger.click(function(){

            var activeContent = $(this).next('.accordion_content');

            if (activeContent.is(':hidden')) {
                allContent.slideUp('fast');
                activeContent.slideDown('fast');
                trigger.removeClass('active');
                $(this).addClass('active');
            } else {
                allContent.slideUp('fast');
                trigger.removeClass('active');
            }

        });

    }

})(jQuery, document, window);

Markup

<ul class="accordion"> <!-- Accordion Element -->

    <li> <!-- Section Wrapper -->
        <a class="accordion_trigger">Trigger 1</a> <!-- Trigger -->
        <p class="accordion_content">Content Area 1</p> <!-- Content -->
    </li>

    <li>
        <a class="accordion_trigger">Trigger 2</a>
        <p class="accordion_content">Content Area 2</p>
    </li>

    <li>
        <a class="accordion_trigger">Trigger 3</a>
        <p class="accordion_content">Content Area 3</p>
    </li>

</ul>
\$\endgroup\$

1 Answer 1

2
\$\begingroup\$

This is awesome code,

I would have added an s to var trigger since you are counting on more than 1 trigger.

\$\endgroup\$
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.