Download
User Rating: 0/5 ( 0 votes)
SMK Accordion is a free jQuery Accordion plugin that you can use in any project you like, be it personal or commercial. Unlike other plugins that offer a lot of options but at the same time this requires a lot of code, this plugin is very small and has only a few options. Basically this was the initial idea, to make an accordion plugin but to not write too much code, in a few words to be lightweight. So, you can enjoi this, it’s minimized source code is 1kb JS and 1kb CSS
Source: smartik.ws
1. INCLUDE CSS AND JS FILES
<link rel="stylesheet" href="css/smk-accordion.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>
<script type="text/javascript" src="js/smk-accordion.js"></script>
2. HTML
<!-- Accordion begin -->
<div class="accordion_example">
<!-- Section 1 -->
<div class="accordion_in">
<div class="acc_head">Section 1</div>
<div class="acc_content">
<p>Section content</p>
</div>
</div>
<!-- Section 2 -->
<div class="accordion_in acc_active">
<div class="acc_head">Section 2</div>
<div class="acc_content">
<p>Section content</p>
</div>
</div>
<!-- Section 3 -->
<div class="accordion_in">
<div class="acc_head">Section 3</div>
<div class="acc_content">
<p>Section content</p>
</div>
</div>
</div>
<!-- Accordion end -->
3. JAVASCRIPT
jQuery(document).ready(function($){
$(".accordion_example").smk_Accordion({
showIcon: true, //boolean
animation: true, //boolean
closeAble: false, //boolean
slideSpeed: 200 //integer, miliseconds
});
});
4. OPTIONS
showIcon: true, //boolean, show plus/minus icon
animation: true, //boolean, animate slide up/down
closeAble: false, //boolean, allow to close all sections
slideSpeed: 200 //integer, miliseconds, if animation is set to "true" define slide speed in miliseconds 1000 = 1 second
closeOther: true, //Allow multiple sections to be open(boolean)
activeIndex: false //Active section. The section index(starting from 1)(integer or false)
JS Tutorial
