Content on Hover or Focus - Success Criterion 1.4.13 (Level AA)

Question

Are users able to control the appearance and disappearance of additional content (e.g. tooltips, popups, and drop-down menus) that is triggered by keyboard focus or mouse pointer hover in your site or application?

Why is this important?

This requirement ensures that the user has control over added content such as popups, tooltips, or drop-down menus. Additional content may be triggered to appear or disappear on the screen when keyboard focus or mouse pointer hover is detected. This may be particularly problematic for people with low vision, cognitive disabilities, and fine motor impairments.

For example:

Content may appear unexpectedly when the user accidentally triggers the interaction with the keyboard or mouse pointer.
The user may not be aware that new content has appeared.
The new content may block view of existing content.
Added content may disappear unexpectedly if mouse pointer hover is moved over the content.

Whom does it benefit?

Example 1

As a person with low vision,
I want to use the escape key instead of my mouse to close tooltip information that obstructs my view
so that I can complete my work quickly without changing page magnification settings every time a tooltip is given.

Example 2

As a person with hand tremors who has a difficult time controlling a mouse,
I want the popup window to stay visible until I hit the close button
so that I can intentionally exit out of the content when finished.

What should you do?

If your site or application allows additional content to appear and disappear triggered by mouse pointer hover and/or keyboard focus ensure:

Additional content does not interfere with the user’s ability to view or operate the page's original content.
The user can perceive additional content and dismiss it without disrupting their page experience.
Added content doesn’t disappear unexpectedly.

How do you do it?

Additional content must be dismissable. Provide a technique (e.g. escape key or close button within the added content) to dismiss the content without moving mouse pointer hover or keyboard focus. If additional content communicates an error message or does not obscure or replace other content, This technique is not necessary.
Additional content must be hoverable. If mouse pointer hover can trigger the additional content, ensure the pointer can be moved over the additional content without the content disappearing.
The additional content must be persistent. The content needs to remain visible until the hover or focus trigger is removed, the user dismisses it, or its information is no longer valid.

Note: The above is not required if the visual presentation of the additional content is controlled by the user agent and is not modified by the author.