5
votes

I have a <div> tag where I’m updating the text every few milliseconds. Visually, I can see the text flashing by, which is good.

I want to make it an aria-live region so I can hear the text flashing by too, but I don’t want JAWS to read every text change. It'll get too bogged down.

So if I change the text 4 times by the time jaws finishes reading the first change, I want jaws to ignore the other 3 changes and to just say the next change (5th change), and so on. The missed 3 changes aren't important.

So I sort of have an aria-live region that's not really alive and it's not really dead. I need some kind of zombie middle ground.

I've tried various combinations of 'polite' and 'assertive' as well as aria-busy but nothing I've tried works.

Any ideas?

1
Thanks for clarifying my title, user2864740slugolicious
If you are running into a problem like this, then that is a clear indication that you really do not want to use aria-live at all. You want the user to be able to look for the updates themselves. You will probably find that there is a better solution to this problem that sighted users will also find useful. For example, you might want to implement some sort of ticker or log of the updates that have recently happened, so that a user can go and look at those. This would solve the problem and help sighted users who have difficulty keeping track of multiple updates happening in a rapid fashion.unobf
@unobf - In a larger app, finding another solution might make sense, but it my case, the whole point of my webpage was to show the text updates. I'm teaching a class on accessibility to developers and testers. During the class, I need some volunteers to help with some demos. I wanted to be prepared in case no one volunteered (which is what actually happened). So I wrote a simple page with one button ("choose a volunteer") and a big text area showing the names of the students. The text would quickly update at first then get slower until a name was chosen. Kind of like spinning a wheel.slugolicious

1 Answers

2
votes

You can keep an empty <div aria-live="polite"></div> in the bottom of your document. Then inject a copy of the text you want to say at certain intervals into the aria-live div and then remove the text from the aria-live div a second or so later.

Be careful how you use it though. I could see examples of usage being announcing percentage of loading, or for a live population counter where you may want to announce it every couple of seconds or so.

For the most part though let the screen-reader do what it's meant to do. Sometimes we over-think a solution.