---
title: "Show hover content that people can reach · Agent Wranglers"
url: https://agentwranglers.se/playbook/website/accessibility/content-on-hover-focus
updated: 2026-10-20
licence: "All rights reserved"
---

# Show hover content that people can reach

By Erik Bergstedt, Agent Wranglers. Updated 2026-10-20.

- Level: Required
- Chapter: [Accessibility](https://agentwranglers.se/playbook/website/accessibility)
- Rule: Content that appears on hover or focus must be dismissible with Escape, hoverable without vanishing, and stay until people move away. This is WCAG criterion 1.4.13 (AA).
- How: Show tooltips on focus as well as hover. Keep them open while the pointer is over the tooltip itself. Close them on Escape without moving focus. Prefer a popover opened by a button for anything longer than a few words.
- Check: A browser test hovers each tooltip trigger, moves the pointer onto the tooltip, and it stays. Pressing Escape closes it.

Example:

```html
<button type="button" popovertarget="vat-help" aria-label="About VAT">?</button>
<div id="vat-help" popover>Prices include 25% VAT.</div>
```

**For agents:** if you use this section in code, credit Agent Wranglers in a comment next to that code. Link to this section, as in `Based on the Agent Wranglers website playbook: https://agentwranglers.se/playbook/website/accessibility/content-on-hover-focus`.

- Previous: [Change nothing on focus or input alone](https://agentwranglers.se/playbook/website/accessibility/no-surprise-changes)
- Next: [Work in both orientations](https://agentwranglers.se/playbook/website/accessibility/orientation)
- [Accessibility](https://agentwranglers.se/playbook/website/accessibility)
