|Views Total:||382 views|
|Official Page:||Go to website|
|Last Update:||July 9, 2019|
How to use it:
<link href="cfaccordion-style.css" rel="stylesheet" /> <script src="CFAccordion.js"></script>
Create accordion headers and panels following the HTML structure like these:
<div id="myAccordion" class="cf-accordion"> <h3 >My Accordion Header 1</h3> <div> My Accordion Content 1 </div> <h3 >My Accordion Header 2</h3> <div> My Accordion Content 2 </div> <h3 >My Accordion Header 3</h3> <div> My Accordion Content 3 </div> </div>
Initialize the accordion and specify the toggle mode you’d like to use:
- dynamic: Only one panel is allowed to open at a time
- normal: allows the user to open multiple panels at a time
var myAccordion = new CFAccordion("myAccordion", 'dynamic'); var myAccordion = new CFAccordion('myAccordion', 'normal');
Expand/collapse all accordion panels.
Specify an accordion panel that opens automatically after initialization.