Forum Discussion
Dials ALT text?
Thank you so much SamHill for confirming I am not going insane!! That is exactly what we are experiencing. Our QA testers are asking us to fix it, but it doesn't seem like an 'us' fix. As you say it seems hard coded. Fingers crossed for a resolution!
Hi DonnaWestwood if you would like to add a "hotfix" to this particular issue, if you add this Execute JavaScript trigger to the Dials timeline starts event, this will update the aria-label to your required value. I've made it configurable so you can include the range details, or just go with a user defined ALT text value.
// ----------------- START configuration options ----------------- //
// Replace Volume with your required ALT text.
const alt = "Volume";
// Use type 1 to include the range information, and type 2 for just the text you define in alt.
const type = 1;
// ------------------ END configuration options ------------------ //
const dial = document.querySelector('input[type=range]');
let min, max;
if(type === 1) {
min = dial.getAttribute('min');
max = dial.getAttribute('max');
}
const aria = (type === 1 ? `${alt} dial range from ${min} to ${max}` : `${alt}`);
dial.setAttribute('aria-label', aria);
If you look at the details within the configuration options in the script, there are two values you can change, alt and type. The existing value of alt is currently defined as Volume.
The type value is currently set as 1 which means the value you define in alt will be used in conjunction with the following information dial range from X to Y, where X is the minimum value in the dial range and Y is the maximum value in the range.
Changing the type value to 2, will drop this information from the updated ALT text value dial range from X to Y.
In my example, if I have the type set as 1, the full ALT text value will be Volume dial range from 0 to 100. If the type is set to 2, the ALT text value will be simply Volume.
- DonnaWestwood6 months agoCommunity Member
This is great SamHill I'll give it a go and report back :) Appreciated!!
Related Content
- 6 months ago
- 7 months ago
- 5 months ago