\$\begingroup\$
\$\endgroup\$
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>
Jamal
35.2k13 gold badges134 silver badges238 bronze badges
1 Answer 1
\$\begingroup\$
\$\endgroup\$
0
This is awesome code,
I would have added an s to var trigger
since you are counting on more than 1 trigger.
answered Oct 30, 2014 at 20:36
default