Maccordion: options: active

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( { active: 1 } );
// this one will be ignored because this tab is animated now
$( ".maccordion" ).maccordion( { active: 1 } );
$( ".maccordion" ).maccordion( { active: -1 } );

$( ".maccordion" ).maccordion( { effect: false } );
// opens tab 
$( ".maccordion" ).maccordion( { active: 0 } );
// closes tab
$( ".maccordion" ).maccordion( { active: 0 } );