I like getting things fast, condensed and straightforward.

Here is an attempt to showcase the power of jQuery when you want to make it quick and simple.
With 2 lines of code (considering jQuery's 'combo-scripting'), I came up with a lightweight but powerfull (I think) accordion.

[update from Dec 14 : Thanking Cedrics ;-)]
A demo of this tutorial can be found at this address :


You can also download files there :


The HTML :

Items #1's header

Item #1's content goes here ...

Items #2's header

Item #2's content goes here ...

The JS :


The CSS :

width : 400px;
height : 378px;
background-color : grey;
padding: 10px;
.head_ {
padding:4px 0 4px 20px;
display : none;
.open_ >.content_{
display : block;