Maccordion: options: disabled

by Dattaya

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>
        <div class="inner_maccordion">    
            <h3><a href="#">First header</a></h3>
            <div>First content</div>
        </div>
    </div>
    
    <h3><a href="#">Second header</a></h3>
    <div>Second content <br><br><br><br></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: false, heightStyle: "auto" } );

$( ".inner_maccordion" ).maccordion( { heightStyle: "auto-h" } );