Search Menu
Language Menu
Mobile Menu
OGCIO

3.6 Success Criterion 1.4.13 – Content on Hover or Focus

If additional content appears on focus/hover, you should ensure all of the following:

  • Dismissible: User can dismiss the additional content with the keyboard without moving focus/hover, e.g. via the escape key;
  • Hoverable: User can move the pointer over the additional content without making the additional content disappear; and
  • Persistent: The additional content remains visible until the hover or focus trigger is removed, or the user dismisses it, or its information is no longer valid.

 

Before Rectification

A webpage sample displayed with a mega dropdown menu which covers part of the main content. When user activates the “Support” menu via keyboard, a mega menu is displayed, which covered part of the main content.  User is unable to view the content unless he/she moves the mouse pointer away from the mega menu.

 

After Rectification

A webpage sample with a mega menu disappeared. Function is added for user to close the mega menu by pressing Escape key without moving the mouse pointer.

 

WCAG 2 Reference:
https://www.w3.org/WAI/WCAG21/Understanding/content-on-hover-or-focus.html