Many sites have dropdown menus where the expanding of the links can only be triggered by a mouse hover. This means that for keyboard only users parts of the site are harder or sometimes impossible to reach.
This plugin makes these dropdown menus keyboard accessible. When tabbing through the primary navigation the sub level menus will become visible and users will be able to tab to the lower level links.
The current version has been tested by both sighted keyboard-only users and screen reader users. If it doesn’t work for your reader, please let us know!
How it Works:
Using the script, whenever a link in the menu gets focus its containing list item (
Current version built and maintained by Amy Hendrix.
The original version of this plugin was built by Graham Armfield. It is still available at http://www.coolfields.co.uk/2011/12/wordpress-keyboard-accessible-dropdown-menus-plugin-version-0-1/
The mechanism used in this plugin is based on the same logic used in Blake Haswell’s excellent example of a multi-level accessible dropdown menu. You can find it at: http://blakehaswell.com/lab/dropdown/deux/
- Will this work with any theme?
We can’t guarantee that it works in all themes, but it now works with many more than in earlier versions. It has been tested in Twenty Ten through Twenty Thirteen, themes based on Automattic’s Underscores base theme, and a number of others. The plugin looks for the “navigation” ARIA role rather than any particular ID, so it should work in most themes that correctly implement roles.
- What about child themes?
If the plugin works in a parent theme, it should work in child themes based on that parent. However, because of the nature of child themes, this cannot be guaranteed.
Contributors & Developers
“Accessible Dropdown Menus” is open source software. The following people have contributed to this plugin.Contributors
Translate “Accessible Dropdown Menus” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
- Extend to multiple themes: now works with all the Twenties, themes based on Underscores, and many others, provided they correctly use ARIA role=navigation for menus.
- Fix an issue that caused the keyboard access code to break mobile navigation.
- Pre-release build for client needs. Compatible with Twenty Twelve & Twenty Thirteen.
- Correctly enqueue scripts.
- Reformat README for Plugin Repo submission.
- Original version.