Using renderlet:ACCORDION

The ACCORDION is a container that allow to display a lot of content in a mimimal space, while remaining easily browsable.

 

The following examples demonstrate some possibilities of the renderlet:ACCORDION.

 

For the complete list of features of the accordion, have a look in the reference.

 

Note: The accordion will consider it's immediate dependancy (childs) as alternatively the handles and the contents of the accordion. In that way, a typical implementation is to define the childs of a renderlet:ACCORDION as a groupment of pairs of renderlet:BOX, first of the pair being the handle and the second the content of an accordion panel.

Simple implementation

Click me for panel #1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Click me for panel #2
Click me for panel #3
Box 3
Box 3
Box 3

Same accordion, with custom CSS

Click me for panel #1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Click me for panel #2
Click me for panel #3
Box 3
Box 3
Box 3

Remote control buttons are added

Click me for panel #1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Box 1
Click me for panel #2
Click me for panel #3
Box 3
Box 3
Box 3