
jquery-multi-open-accordion
If you are looking to have the same look of jQuery UI Accordion and wish that you can keep more than one tap opened, with basic accordion functionality, then this plugin might help you.
If you can improve the performance and plugin option, you are more than welcome :)
Markup
```
tab 1
Lorem ipsum dolor sit amettab 2
Lorem ipsum dolor sit amettab 3
Lorem ipsum dolor sit amettab 4
Lorem ipsum dolor sit amet```
Script
```
// this will make the second tab by default opened (index starts from 0)
$('#multiOpenAccordion').multiAccordion({active: 1 });
// [ OR ] // supports multiple tabs to be opened by default $('#multiOpenAccordion').multiAccordion({active: [1, 2, 3] });
// you can also set active:false if you don't want any tab to be opened by default $('#multiOpenAccordion').multiAccordion({active: false });
// show all tabs
$('#multiOpenAccordion').multiAccordion({active: 'all' });
// hide all tabs
$('#multiOpenAccordion').multiAccordion({active: 'none' });
// you can set the options as any jQuery UI plugin using option method
$('#multiOpenAccordion').multiAccordion('option', 'active', 'all');
```
Events
``` /* fired when any tab is clicked, ui here hold clicked tab and its content * ui['tab'] // current tab * ui['content'] // current tab content (div) */ click: function(event, ui) {}
// when accordion is initialized, ui here holds a jQuery object to the whole accordion
init: function(event, ui) {}
// when tab is shown, ui here hold the same as in click event above
tabShown: function(event, ui) {}
// when tab is hidden, ui here hold the same as in click event above
tabHidden: function(event, ui) {}
// How can you bind these events ?
// 1. at plugin initialization
$('#multiOpenAccordion').multiAccordion({
active: 'all',
click: function(event, ui) {
alert('tab is clicked!');
}
});
// 2. after initialization
$('#multiOpenAccordion').multiOpenAccordion('multiopenaccordionclick', function(){
alert('also clicked');
});
```
Methods
// destroying the plugin and removing all handlers, and styles
$('#multiOpenAccordion').multiOpenAccordion('destroy');
Project Information
- License: MIT License
- 17 stars
- svn-based source control
Labels:
jQuery
jquery-ui
javascript
plugin