The aria-valuetext attribute is used to define the human readable text alternative of aria-valuenow
for a range widget such as progressbar, spinbutton or slider.
Authors SHOULD only set the aria-valuetext
attribute when the rendered value cannot be accurately represented as a number. For example, a slider may have rendered values of small
, medium
, and large
. In this case, the values of aria-valuenow
could range from 1 through 3, which indicate the position of each value in the value space, but thearia-valuetext
would be one of the strings: small
, medium
, or large
.
Value
String representation of a number
Possible effects on user agents and assistive technology
If the aria-valuetext
attribute is absent, assistive technologies will rely solely on the aria-valuenow
attribute for the current value. If aria-valuetext
is specified, assistive technologies SHOULD render that value instead of the value of aria-valuenow
.
Examples
Example 1:
The snippet below shows a simple slider for selecting a day of the week. The value of the slider is numeric, and the aria-valuetext
attribute is used to provide the name of the day. The application would programmatically update aria-valuetext
depending on aria-valuenow
.
<div role="slider" aria-valuenow="1"
aria-valuemin="1" aria-valuemax="7"
aria-valuetext="Sunday">
Working Examples:
Notes
Used With ARIA Roles
- progressbar
- scrollbar
- slider
- spinbutton
Related ARIA techniques
Compatibility
TBD: Add support information for common UA and AT product combinations
Additional resources