Content on Hover or Focus (1.4.13 – Level AA)

When hover or focus triggers content to appear, it is dismissible, hoverable and persistent.

Introduction

Additional content triggered by keyboard focus or mouse hover can cause accessibility issues for users with visual or cognitive impairments. Additional content can surprise users, prevent them completing a task or obscure content.

To overcome these issues, users must be able to understand when additional content appears and dismiss it.

How to Pass ‘Content on Hover or Focus’

Where keyboard focus or mouse hover triggers additional content to appear, the content must be:

• Dismissible by the user without moving keyboard focus or mouse hover (for example by pressing the ‘escape’ key or closing on click);
  
• Hoverable by the mouse pointer so the pointer can be moved over the content; and
  
• Persistent until the user changes keyboard focus or mouse hover, dismisses the content or the content is no longer valid.

Exceptions

• Where the content communicates an input error
  
• Where the content doesn’t obscure other content
  
• Where the additional content is controlled by the user, for example tooltips or sub-menus that appear on mouse hover which are controlled by web browser settings

‘Content on Hover or Focus’ Tips

Try not to use this type of content if you can avoid it – add your additional content to the page. 

See Also

• 2.1.1 – Keyboard
• 3.2.1 – On Focus
• Understanding Success Criterion 1.4.13 (W3C)