An accordion is, as jQuery UI aptly puts it, a UI widget that “displays collapsible content panels for presenting information in a limited amount of space.”

It is a series of panels or content panes; only one may be visible at a time, and the header for each section is clickable/tappable, which causes that section to open (and the rest to close).

See it in actionEdit

Ex: jQuery UI Accordion demo

Search the Web for “accordion demo” for more.


Opinions like this should be sourced, but often, a better alternative exists when an accordion might be used.

A disadvantage is that it separates options by inserting a block of content in what would otherwise be a continuous navigation.

Discussion at