You can never underestimate the uses of a jQuery accordion. They can be to use them for menus, slideshows, squeezing content into sidebars, the list is endless! To make life easier, we made a list of ten jQuery accordions that you can use on your site. Enjoy!

1. Xbox 360-like horizontal jQuery Accordion

An Xbox-like horizontal accordion that would look really good being used as a featured content slideshow – an alternative to the JonDesign one that everyone uses.

2. HoverAccordion jQuery Plugin

An like vertical accordion that opens on hover that would look good on your sidebar.

3. Stupid Simple jQuery Accordion Menu

Accordion menus are a very handy tool to show and hide information as needed. Learn how to create one.

4. State-Saving jQuery Accordion Menu without Reloading the Page

Learn how to create tweaked accordion menu, in which you can bookmark and re-access sections without re-clicking on them.

5. Accordion Menu Screencast Tutorial

Learn how to build a simple, unobtrusive, accordion style menu using basic events and animations.

6. Accordion Madness

One of the options how to create accordion menu.

7. Slide Out and Drawer Effect

This tutorial will walk through how to create your own simple plugin, and then replicate the Apple downloads drawers using the very excellent Accordion plugin.

8. TinyAccordion JavaScript Accordion

This lightweight (1.2 KB) JavaScript accordion can easily be customized to integrate with any website. It now includes multi-level support, a parameter to determine whether only one panel can be expanded concurrently, and a hide/show all toggle.

9. JavaScript Accordion Menu Wizard

JavaScript Accordion Menu is an image based site navigation menu. ScriptOcean Accordion Menu Wizard supports horizontal and vertical accordion menus.

10. Extra: Grid Accordion – $8

Grid Accordion combines the functionality of a thumbnail grid and an accordion panel, offering you an interesting method to display your portfolio.

Tags: jQuery Accordions
Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.

Free Guide:

How to Choose the Right Charting Library for Your Application

How do you make sure that the charting library you choose has everything you need? Sign up to receive this detailed guide from FusionCharts, which explores all the factors you need to consider before making the decision.

Special Offer
Free course!

Git into it! Bonus course Introduction to Git is yours when you take up a free 14 day SitePoint Premium trial.