Contactemail:

writings

Keyboard accessible dropdown menu

This dropdown menu is based on Matthew Carroll's Keyboard Accessible Suckerfish (external link) script. Some styles are borrowed from Sons of Ursidae Menus (external link). It combines the ideas from the both sources with some additional CSS rules.

With JavaScript ON, the sub-menu is keyboard accessible. For the keyboard users it behaves in the same manner as for the mouse users.

With JavaScript OFF, the sub-menu items are still keyboard accessible in the most used browsers. Although only the focused item is shown (and, in some browsers, the sub-menu beneath it, if any), it appears in the correct position and helps the keyboard users not to lose their way through the menu.

This article is a work in progress.

Meanwhile, be sure to check out the working example.