• Success Criterion 1.4.13
  • Conformance level AA

1.4.13 · Content on Hover or Focus

Lesson overview · Content on Hover or Focus

In plain language

Tooltips/menus that appear on hover or focus must stay visible, be dismissible with Esc, and let the mouse move onto them.

Who it affects

Screen-magnifier users, people with motor tremors, and keyboard-only users of tooltips/menus.

How to check

Hover and Tab onto each tooltip/menu: press Esc (it should close), move the pointer onto it (it should stay), and confirm it doesn't vanish on its own. Worked example — A streaming music app's search results: focus a control that triggers a popover: if it steals focus unexpectedly or the popover closes itself and dumps focus elsewhere, it fails.

Common misconception

A tooltip that appears on hover often gets ignored in testing because it looks fine to a mouse user. Try reaching it with the keyboard, or moving your mouse toward it, and many tooltips vanish before you can read them. Real example: on a university's online course catalog, content that appears on hover (tooltip, preview) vanishes when the user tries to move the mouse onto it — it can never be read closely.

Learn more

Scenarios in this lesson