Forum Discussion
Customized thumb of progress bar can be moved
Hi Community!
I've set up a customized thumb for my progress meter. This thumb can be moved from learners and I can't figure out how to restrict this behavior.
I already set up a hotspot and unchecked the "show hand cursor on hover".
I added a short video to visualize my problem.
I hope someone can help me to find a solution!
Thank you and greetings from Germany
Draw a rectangle over the full width of the progress bar, no border, and fill the rectangle white but set the fill to 99% transparent. The progress bar will be visible but users won't be able to interact with the progress bar with the mouse pointer since the rectangle is on top of it.
Next, hide the rectangle and the progress bar from the focus order (or uncheck "Object is visible to accessibility tools" in the Size and Position > Accessibility tab). If you want the screen reader to point out that the progress bar is there, apply your alt-text to the rectangle. Keeping the progress bar hidden from accessibility tools will ensure users can't tab to it and use their keyboard to interact with it.
When you put a hotspot (or a transparent shape) over a slider, the slider should not be accessible to the user. That's true whether the thumb is customized or not.
In other words, what you're experiencing is unexpected behavior.
- It's possible that the slide is corrupted. Try creating a new version to see if that solves the problem.
- If not, contact support directly: https://access.articulate.com/support/contact
Draw a rectangle over the full width of the progress bar, no border, and fill the rectangle white but set the fill to 99% transparent. The progress bar will be visible but users won't be able to interact with the progress bar with the mouse pointer since the rectangle is on top of it.
Next, hide the rectangle and the progress bar from the focus order (or uncheck "Object is visible to accessibility tools" in the Size and Position > Accessibility tab). If you want the screen reader to point out that the progress bar is there, apply your alt-text to the rectangle. Keeping the progress bar hidden from accessibility tools will ensure users can't tab to it and use their keyboard to interact with it.
JudyNollet thank you so much for the quick reply!
Your reference to use a transparent shape was actually solving my problem. I feel like the hotspot should do the same but (for whatever reason) it doesn't work in my project.
So thank you for this really quick solution :D
