Microsoft Vista Software | Microsoft Vista Books | Linux Books | Ubuntu Books | Ruby On Rails Books

Thursday, January 05, 2006

Rico Accordion

I checked out the Rico Accordion and must say it is pretty cool. What is Rico Accordion?
The Rico.Accordion behavior makes use of the Effect.AccordionSize which is an effect that simultaneously grows the height of one element while shrinking the height of another. The Rico.Accordion behavior adds the necessary event handlers on the respective divs to handle the visual aspects of expanding, collapsing and hovering.

How do you implement it?
To attach the accordion behavior to the accordion container div, construct a Rico.Accordion object and pass the container to it. Thats it!
new Rico.Accordion( $('accordionDiv') );
-or-
new Rico.Accordion( $('accordionDiv'), {panelHeight:300} );
The second example specifies the height of the accordion panels. There are many other configuration parameters that can be specified to modify various visual aspects of the accordion. The panelHeight is the attribute that is most commonly overridden.

Find out more here

1 comment:

Anonymous said...

Thanks for the great tip! But why doesn't work the same way in Firefox?? The contents are spilling into the next section's header!