Accordion Pane Keyboard Navigation Proposal

8/04/07
Earl Johnson
Sun Microsystems, Inc.

This table attempts to merge the input from the Flash Accordion Component from, and the latest Tab key influenced feedback from Sun's reviews. The main differences between the Sun's proposal and what Flash and Dojo use:

In Flash, Tab takes you inthen out of accordeion in as little as 2 key presses; the Sun proposal has no special "navigate out of Accordion" equivalent tho Tabbing is how you eventually get out of accordionm.
In Flash and Dojo, arrow keys channge the panre; this proposal uses Tab for this.
Flash defined other useful single key keysequences [e.g. page-up]; the Sun spec picked these up.

Key	Description
Down Arrow, Right Arrow	Moves focus right and/or down within the content pane. Note: This behavior also describes how the Button's pull down should react.,
Up Arrow, Left Arrow	Moves focus left and/or up within the content pane. Note: This behavior also describes how the Button's pull down should react.,
End	- Selects the last element in the content pane if focus is in the content pane. Note: This also describes behavior for how the Button's pull down should react. - Selects the last content header when focus is on the pane header Note: This action is not applicable to the Button's pull down.
Home	- Selects the first element in the content pane if focus is in the content pane. Note: This also describes behavior for how the Button's pull down should react. - Selects the first content header when focus is on the pane header. Note: This action is not applicable to the Button's pull down.
Enter/Space	Activates a menu item. Note: This behavior also describes how the Button's pull down should react.,
Page Down	Selects the next pane header regardless of where focus is in the current header or pane content. Selection cycles from the last pane header to the first pane header. Note: This action is not applicable to the Button's pull down.
Page Up	Selects the previous pane header regardless of where focus is in the current header or pane content. Selection cycles from the first pane header to the last pane header. Note: This action is not applicable to the Button's pull down.
Cntrl + Up Arrow	Moves focus from anywhere in a content pane to the content pane's header. Note: No action occurs when focus is in the content pane's header.
Cntrl + Down Arrow	Moves focus from anywhere in the content pane's header to the first focusable element in the content pane. Note: No action occurs when focus is in the content pane.
Shift+Tab	Moves focus to the previous component. This component may be inside the selected child, or outside the accordion; it is never another header in the same accordion. Note: When focus is in the pull down menu, pressing this sequence moves focus to the content pane's header text.
Tab	Starting from the Accordion Header, moves focus as follows: Each interactive glyph on the accordion global header to, The pane header's title text to, The menu to, The container content pane, focus is placed on the first tab navigable element to, When true, one of the following: The next tab navigable element in the content pane to, The next content pane header if the content pane does not contain a tab navigable element to, On the last tab navigable element, out of the accordion component.
Cntrl+F10	- Posts the content pane header's button menu if focus is in the content pane or it's header - Posts the Accordion pane header only if focus is on the header and if applicable.
Esc	- Dismisses the content pane header's button menu if it is posted. - Dismisses the Accordion pane header's button menu if it is posted.