A simple, user-friendly and lightweight jQuery accordion plugin with smooth animations powered by CSS3 transitions.
This is the new version of Woco Accordion and comes with more options and features.
Download: https://github.com/chooowai/woco-accordion
Demonstration: http://chooowai.github.io/woco-accordion/
Plugin homepage: http://chooowai.github.io/woco-accordion/
Implementation:
<html>
<head>
<script src="jquery-1.11.3.min.js"></script>
<script src="woco.accordion.min.js"></script>
<link href="woco-accordion.css" rel="stylesheet">
</head>
<body>
<div class="accordion">
<h1>Section 1</h1>
<div>
Content 1<br>Content 1<br>Content 1<br>Content 1<br>
</div>
<h1>Section 2</h1>
<div>
Content 2<br>Content 2<br>Content 2<br>Content 2<br>
</div>
<h1>Section 3</h1>
<div>
Content 3<br>Content 3<br>Content 3<br>Content 3<br>
</div>
</div>
<script>
$(".accordion").accordion();
</script>
</body>
</html>
Options:
firstChildExpand | Boolean | Default : true – whether the first section is expanded or not |
multipleExpand | Boolean | Default : false – whether expanding mulitple section is allowed or not |
slideSpeed | Integer | Default : 500 – slide animation speed |
dropDownIcon | String | Default : “▼” – drop down icon |
Screenshots: