A vertical accordion by greatestview.
Turnes a simple ul-list or similar into a vertical accordion. Almost completely DOM independent, perfect for complex CMS markup. Multiple nesting possible.
This plugin is easy to handle, very lightweight and CSS independent. Every kind of styling remains in your control with your CSS files. If you need additional styling, this script provides a class, which is applied to expanded elements: gv-accordion-active. With this class you can handle additional animations of arrows or background replacements. Furthermore you can attach this class to any list items, which should appear expanded on first load.
You can apply it to very different kinds of HTML structure. However not every possible structure can be tested, so this is what a preferred way may look like:
ul/ol (where the script is attached) |- li |-- hx title_class |-- div body_class |-- ul/ol (optional nested child accordion, attach the script here a second time) |---- li |------ hy children_title_class |------ div children_body_class
- Use unique body selectors when using nested accordions to prevent interferences!
- title_selector and body_selector must be siblings on the same DOM level
Tested with: IE8+, Chrome, Firefox, Opera, jQuery 1.7.2
Todo: collapse all function