Maccordion: options: speed
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/ui-lightness/jquery-ui.css">
<script src="https://raw.github.com/Dattaya/Maccordion/master/jquery.dattaya.maccordion.js"></script>
<div class="maccordion">
<h3><a href="#">First header</a></h3>
<div>First content</div>
<h3><a href="#">Second header</a></h3>
<div>Second content</div>
<h3><a href="#">Third header</a></h3>
<div>Third content</div>
</div>
CSS
.dattaya-maccordion .dattaya-maccordion-header {
cursor: pointer; position: relative; margin-top: 1px; padding: .5em .5em .5em 2.2em; zoom: 1;
}
.dattaya-maccordion .dattaya-maccordion-header-active {
border-bottom: 0 !important;
}
.dattaya-maccordion .dattaya-maccordion-heading {
outline: none;
}
.dattaya-maccordion .dattaya-maccordion-header .ui-icon {
position: absolute; left: .5em; top: 50%; margin-top: -8px;
}
.dattaya-maccordion .dattaya-maccordion-content {
padding: 1em 2.2em; border-top: 0; margin: 0 0 2px; position: relative; overflow: auto; display: none; zoom: 1;
}
JavaScript
$( ".maccordion" ).maccordion()
.children( ":second" )
.next()
.andSelf()
.remove();
$( ".maccordion" ).maccordion( "refresh" );