WebAIM - Web Accessibility In Mind

E-mail List Archives

Web Accesibility and popovers

for

From: Date: Apr 11, 2019 4:23PM

I am about to use bootstrap popover to show some content after the user
clicks a button. These popovers allow you to add wherever content and this
content will appear in a small box next to the element that trigger the
action.

This content can have 'buttons' for further actions.

Checking the accessibility I found:
- use aria-describedby to link the content.
- the element only has aria-describedby when the popover is visible in
the screen after clicking the button for example.

It is a good way to provide accessibility to an element like that? How you
will do it if you have the freedom to implement the component from scratch?

This is an example:
https://codepen.io/luarmr/pen/JVJGMJ

This is the original component in bootstrap doc:
https://getbootstrap.com/docs/4.0/components/popovers/