E-mail List Archives
role="alert" and display:none
From: Maia Miller
Date: Oct 5, 2022 6:37PM
- Next message: Peter Weil: "Re: role="alert" and display:none"
- Previous message: email@example.com: "Re: PDF table of contents"
- Next message in Thread: Peter Weil: "Re: role="alert" and display:none"
- Previous message in Thread: None
- View all messages in this Thread
I have a client working on applying live regions onto their error
messages as per 4.1.3 Status Messages
We've advised that the container with the live regions (for example,
<div role="alert">) must be in the DOM on load. The error message can
then be updated with validation.
According to MDN docs*, we can hide this <div> using display:none, then
changing the display to block will read out the alert. My question is:
how is this happening? My understanding is that screen readers ignore
display:none as it essentially removes the element from the document.
But a live region that appears on load with display:none still gets
recognized by AT?
Thanks for your help!
* MDN docs reference:
*Maia Miller*, WAS (Web Accessibility Specialist)
AAP WAS small circular badge and horizontal name logo for International
Association of Accessibility Professionals (IAAP) Web Accessibility
Specialist (WAS) credential. To the left is a dark blue circle with
three lines of centered white text that read: IAAP Certified WAS. There
is a smaller light blue circle that surrounds the dark blue inner circle
that designates the WAS credential color scheme. To the right, two lines
of dark blue text. Top text reads Web Accessibility Specialist, second
line reads International Association of Accessibility Professionals.
Catalyst IT - Expert Open Source Solutions
Catalyst.Net Ltd - a Catalyst IT group company
CONFIDENTIALITY NOTICE: This email is intended for the named recipients
only. It may contain privileged, confidential or copyright information.
If you are not the named recipient, any use, reliance upon, disclosure
or copying of this email or its attachments is unauthorised. If you have
received this email in error, please reply via email or call +64 4 499 2267.