キーボード操作
| キー | 動作 |
|---|---|
| トリガー上で Enter または Space | ポップオーバーを開閉します。 |
| Tab | 開いているポップオーバーの中に移動します。ポップオーバーはトリガーの直後にあります。 |
| Esc | ポップオーバーを閉じてトリガーにフォーカスを戻すか、ホバーカードを隠します。 |
アクセシビリティの注意点
- ポップオーバーは非モーダルの
dialogです。aria-labelまたはaria-labelledbyで名前を付けてください。トリガーにはaria-haspopupと、ブラウザーによるaria-expandedが付きます。 - ホバーカードは
tooltipで、トリガーのaria-describedbyになるため、そのテキストはトリガーと一緒に読み上げられます。操作できる要素は入れないでください。それにはポップオーバーを使います。 - ホバーカードは WCAG 1.4.13 を満たします。Esc キーでフォーカスを動かさずに隠せ、ポインターをカードの上に移動でき、ホバーまたはフォーカスしている間は表示されたままです。