Summary

We first looked at what the accordion does and how it is targeted by the CSS framework. We then moved on to look at the configurable options that can be used to change the behavior of the accordion, such as specifying an alternative heading to be open by default, or setting the event that triggers the opening of a content drawer.

Along with configurable options, we saw that the accordion exposes several custom events. Using them, we can specify callback functions during configuration, or bind to them after configuration to execute additional functionality, in reaction to different things happening to the widget.

Next, we looked at the accordion's default animation and how we can animate the opening of content panels, using easing effects. We saw that to make use of non-standard animations or easing effects, the jquery.ui.effect.js file needs to be included along with the requisite custom effect file.

In addition to looking at these options, we also saw that there are a range of methods...