jQuery Searchable 3 Level Accordion

Hi!

Thanks for purchasing jQuery Searchable 3 Level Accordion! You will find all docs regarding the plugin below. If you need any assistance or have any suggestions regarding the plugin, don't hesitate to contact us on: support@createIT.pl.

How to implement the plugin:

One good example is better than thousand words, so just have a look at example file. You will find there XHTML/CSS/JS code that is necessary to run the plugin without any unnecessary addons. Just copy and paste it to your website and it will work (oh, did I mention that you may modify the code any way you want?).

More examples

1. So.. you want the animation to go slower? Try this:

   $("#accordion").ctAccordion({
   	duration: 600
   });
   

   See the demo »
2. To allow more than one node to be opened at one time

   $("#accordion").slickMenu({
   	oneOpenAtTime: false
   });
   

   See the demo »
3. To set skin to "color": In head section:

   <link rel="stylesheet" type="text/css" href="../css/skins/color/style.css" />	
   

   In body section:

   <ul id="accordion" class="skin-color">
   

   See the demo »
4. To open some node on page load (think of stateful menu):

   
   	...
   	<li class="expanded"><a href="#">Hello</a></li>
   	...
   

   See the demo »
5. Change speed and easing of opening:
   

   <script type="text/javascript" src="js/jquery-ui-effects.js"></script>
   <script type="text/javascript">
   $(document).ready(function() {
   	$("#accordion").ctAccordion({
   		easing: "easeOutBounce",
   		speed: 1500
   	});
   });
   </script>
   
   

   See the demo »

Plugin options

The plugin has following options:

• headerClass (default: "head"): name of class that will be automaticaly added to all "header" links - ie nodes that have ancestors
• defaultExpanded (default: ".expanded"): give this class to the element you want to be expanded on page load
• expandedPathClass (default: "open"): name of class given to opened element
• collapsedPathClass (default: "closed"): name of class given to closed element
• foundPhraseClass (default: "searchMatch"): name of class to wrap matched content in search process
• event (default: "click"): event on which accrdion should open/close
• myClass (default: "ctAccordion"): class given whole accordion
• oneOpenAtTime (default: true): should plugin auto-hide non-active elements?
• easing (default: "linear"): easing to use during open animation
• speed (default: 200): speed of open animation
• onOpen (default: $.noop): event fired just before node open (argument passed: "a" element that names opened submenu)
• onClose (default: $.noop): event fired just before node close (argument passed: "a" element that names closed submenu)

Plugin provides also following methods:

• option(option, [value]): Get or set any option. If no value is specified, will act as a getter
• search(query): Search for given value in accordion
• open(level1Index, [level2Index]): Open given position on first level and given position on second level (second level is optional)

Any comments?

Did you find any bug? Or maybe see any feature that would be nice to have? Or maybe just wanna say "hi"? Mail us at support@createIT.pl, we'll be glad to talk to you!