WAI-ARIA: aria-valuetext (Property)
Description
Defines the human readable text alternative of aria-valuenow for a range widget.
This property is used, for example, on a range widget such as a slider or progress bar.
If the aria-valuetext attribute is set, authors SHOULD also set the aria-valuenow attribute, unless that value is unknown (for example, on an indeterminate progressbar).
Authors SHOULD only set the aria-valuetext attribute when the rendered value cannot be meaningfully 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 the aria-valuetext would be one of the strings: small, medium, or large. If the aria-valuetext attribute is absent, the 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.
Browser Compatibility For aria-valuetext
| desktop | mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
ariaValueText | ChromeFull support81 | EdgeFull support81 | FirefoxNo supportNo | Internet ExplorerNo supportNo | OperaFull support68 | SafariFull support12.1 | WebView AndroidFull support81 | Chrome AndroidFull support81 | Firefox for AndroidNo supportNo | Opera AndroidFull support58 | Safari on iOSFull support12.2 | Samsung InternetFull support13.0 |
aria-valuetext Example
HTML Example
Slider: A user input where the user selects a value from within a given range.
- aria-valuenow: Defines the current value for a range widget.
- aria-valuemin: Defines the minimum allowed value for a range widget.
- aria-valuemax: Defines the maximum allowed value for a range widget.
- aria-valuetext: Defines the human readable text alternative of aria-valuenow for a range widget.
<div
role="slider"
aria-valuenow="1"
aria-valuemin="1"
aria-valuemax="7"
aria-valuetext="Sunday">
</div>Characteristics
Used in Roles
Inherits into Roles
Value
- string
- Unconstrained value type.
Semantic HTML
No HTML element equivalent.
Reference
- W3C (opens new window)
- MDN Web Docs
