Description

Accordion Menu is a simple menu that extends and shrinks when a sub menu is selected inside it.

Screen Shot

API

component-family net.sf.yui4jsf
renderer-type net.sf.yui4jsf.component.AccordionMenuRenderer
component-class net.sf.yui4jsf.component.accordionmenu.AccordionMenu
renderer-class net.sf.yui4jsf.component.accordionmenu.AccordionMenuRenderer
tag-class net.sf.yui4jsf.component.accordionmenu.AccordionMenuTag

Usage

<yui:accordionMenu>
	<yui:tab title="First Menu">
		any components
	</yui:tab>
	<yui:tab title="Second Menu">
		any components
	</yui:tab>
	<yui:tab title="Any Other Menu">
		any components
	</yui:tab>
</yui:accordionMenu>

Attributes

<yui:accordionMenu>

Standard Attributes - id, rendered, binding
animationDuration - Duration of the accordion transition effect in terms of milliseconds
selectedTabIndex - integer defining which tab is selected by default
rootClass - Style class for the main div container
headerClass - Style class for the headers
contentClass - Style class for the contents

Instructions

see accordionMenu*.jsp for examples

Upcoming Features

Styles for each menu

Additional Information

Content Width

When the width is set in rootClass, it may need to be declared in contentClass too otherwise contents may overflow, see the accordionMenu examples for a skinning example