Menu
A menu is a widget that offers a list of choices to the user, such as a set of actions or functions. Menu widgets behave like native operating system menus, such as the menus that pull down from the menubars commonly found at the top of many desktop application windows.
— Menu Pattern, WAI ARIA Authoring Practices Guide (APG)
§ Notes
Missing.css uses role=menu and role=menuitem to define menus and aria-haspopup=menu and aria-controls to define menubuttons.
To get the actual behavior of an accessible menu, you can use Missing.js § Menu.
Don't forget to set an accessible label for the element with role=menu, either by specifying aria-label or by setting aria-labelledby to the menubutton that controls its display.
Keyboard Interaction
- Up Arrow : Move focus to the previous menuitem.
- Down Arrow : Move focus to the next menuitem.
- Escape : Closes the menu.