Creating Accordion Menus

One way to choose a framework is to pick a common thing you want to add to a site, and then see how much that framework helps you to accomplish that task. Here, we want an accordion menu—a type of menu where, when one section is opened, any others automatically close. Similar to a tabbed interface, it’s a common design element.

To create accordion menus:

1.
<link type="text/css" rel="stylesheet" href="jquery/theme/flora/flora.accordion.css" />
<link type="text/css" rel="stylesheet" href="script02.css" />
Script 16.3 needs two CSS files: one provided by jQuery (using one of its built-in themes, Flora) and ours (script02.css, seen in Script 16.4) that adds on the little bit of CSS needed to make things look just the way ...

Get JavaScript and Ajax for the Web: Visual QuickStart Guide, Seventh Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.