I need to add an additional text to tag for screen readers. Unfortunately, I discovered that the NVDA reader does not read either aria-label or aria-labelledby when I hover over the element.
It reads additional text when I move with arrows around the page, but I need it to work on hover
The code I tested looks like this:
<a href="#" id="btn" role="button" aria-labelledby="btn text">Find Out More<span id="text" class="visually-hidden">about [slide title]</span></a>
<a href="#" aria-label="Find Out More about [slide title]">Find Out More</a>
Currently NVDA only reads the content of “Find out more” on hover and ignores both aria-label and aria-labelledby. Unfortunately I can’t remove “Find Out More” from the tag, it needs to be visible to users and I have to add additional text so that NVDA will read “Find out more about [slide title]”.
Does anyone know a way to make NVDA read additional text on hover when has its own text? Perhaps there is a way around this