Accordion, jQuery Plugin

Overview:
================================================================================
This plugin enables an accordion with cookie persistance. This plugin is based 
on my collapsible plugin.

If you find any errors or have suggested changes, please post a comment on the 
github project: http://github.com/juven14/Accordion

Very Basic demos can be found here: 
http://www.snyderplace.com/demos/accordion.html
________________________________________________________________________________
================================================================================


Adding an accordion to your html:
================================================================================

You have to create your own html for the accordion. You need a header element 
(here as h3, can be div or etc) that gets the "accordion" class assigned and a 
body element. However, the slide effect will be choppy if you have margins and 
padding for the container, so here I just use a div. I've used "accordion" but 
you can choose any other selector, also i have added classes to aid with styling, 
and the containers do not have to have these class names. Note that there is a 
slight jump on some panels due to the way jQuery handles slideUp and slideDown, 
see the custom javascript panel below for better sliding. Here is an example:

---HTML code--------------------------------------------------------------------
<h3 class="accordion" id="nav-section1">Navigation Section<span></span><h3>
<div>
    <ul>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
  </ul>
</div>
<h3 class="accordion" id="nav-section2">Navigation Section<span></span><h3>
<div>
    <ul>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
  </ul>
</div>
<h3 class="accordion" id="nav-section3">Navigation Section<span></span><h3>
<div>
    <ul>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
    <li><a href="#">Navigation Item</a></li>
  </ul>
</div>
---end HTML code----------------------------------------------------------------
________________________________________________________________________________
================================================================================


Adding the Javascript to your file:
================================================================================

JavaScript which belongs in the head of the html document, using the cookie 
plugin is optional.  Please note that our default open / config is only an 
example.

---JavaScript code--------------------------------------------------------------
<script type="text/javascript" src="javascript/jquery.cookie.js"></script>
<script type="text/javascript" src="javascript/jquery.collapsible.js"></script>
<script type="text/javascript">
  $(document).ready(function() {
    $('.accordion').accordion({
        defaultOpen: 'section1',
        cookieName: 'accordion_nav'
    });
  });
</script>
---end JavaScript code----------------------------------------------------------

The plugin default options are as follows:
---JavaScript code--------------------------------------------------------------
{
    cssClose: 'accordion-close', //class you want to assign to a closed accordion header
    cssOpen: 'accordion-open', //class you want to assign an opened accordion header
    cookieName: 'accordion', //name of the cookie you want to set for this accordion
    cookieOptions: { //cookie options, see cookie plugin for details
      path: '/',
      expires: 7,
      domain: '',
      secure: ''
    },
    defaultOpen: '', //id that you want opened by default
    speed: 'slow', //speed of the slide effect
    bind: 'click', //event to bind to, supports click, dblclick, mouseover and mouseenter
    animateOpen: function (elem, opts) { //replace the standard slideDown with custom function
      elem.next().slideDown(opts.speed);
    },
    animateClose: function (elem, opts) { //replace the standard slideUp with custom function
      elem.next().slideUp(opts.speed);
    }
}
---end JavaScript code----------------------------------------------------------

Option details:

* cssClose - class assigned when closed
* cssOpen - class assigned when opened
* cookieName - cookie name for persisting panels
* cookieOptions - see jquery.cookie plugin for more info
* defaultOpen - id that you want opened by default
* speed - animation speed
* bind - event that triggers the collapsible, only 
  4 are supported:<br /> click, dblclick, mouseenter, and mouseover
* animateOpen - custom callback to animate opening
* animateClose - custom callback to animate closing

________________________________________________________________________________
================================================================================


Styling 
================================================================================

In the above example HTML you will see a span, this is useful if you wish to 
assign an open/close image.

This plugin will append a user defined (or default, see options above) class to 
header of the accordion.  You can use this to swap out the images or style the 
different states of your accordion.

---CSS code---------------------------------------------------------------------
.accordion h3.collapse-open {}
.accordion h3.collapse-close {}
.accordion h3.collapse-open span {}
.accordion h3.collapse-close span {}
---end CSS code-----------------------------------------------------------------

________________________________________________________________________________
================================================================================