How do I change the animation style of a jQuery Accordion?

Travis Smith picture Travis Smith · May 21, 2010 · Viewed 12k times · Source

Is there a way to change the default animation that jQuery accordion uses? It appears to be "slide" but I'd like to use a Bounce or Drop effect.

Here's my current code:

$("#accordion").accordion({
    autoHeight: false,
    collapsible: true,
    event: 'click',
    active: 4
});

I'd like to change this from a slide to a drop or a bounce.

Answer

Nick Craver picture Nick Craver · May 21, 2010

You can use the animated option for this, for example to get your bounce:

$("#accordion").accordion({ 
  animated: 'bounceslide',
  autoHeight: false, 
  collapsible: true, 
  event: 'click', 
  active: 4
});

The default is 'slide', you can view a demo here.