Accordion plugin written purely in JavaScript.
So, to start using the Easy Accordion plugin in your project, you can include the script in your head/body section as shown below.
<script src="https://cdn.jsdelivr.net/gh/farhanhalai30/easy-accordion/js/easy-accordion.min.js">
Once you have included the script in your code, you can start using Easy Accordion as shown in the code below. For more list of options refer here
Below is the list of options available.
| Option | Description | Type | Optional/Mandatory |
|---|---|---|---|
| target | Selector name of the target element. | String | Mandatory |
| blockClass | Class name for the block element | String | Mandatory |
| triggerClass | Class name for the trigger element (the one which is clickable). | String | Mandatory |
| contentClass | Class name for the content. | String | Mandatory |
| transitionDuration | Amount of time to transite (in seconds). | Number | Optional |
| triggerActiveClass | Class name for the trigger element in the active state (active means accordion is open). | String | Optional |
| contentActiveClass | Class name for the trigger element in the active state. | String | Optional |
-
Basic Example
A basic demo of using Easy Accordion for the first time.
Click here check out in action -
Custom Active Classes
Using custom active classes for trigger & content elements. Classes get added when the accordion is in active state.
Click here check out in action
All browsers (Chrome, Mozilla, Safari) & in Internet Explorer upto IE9.