Slider Example 2: Silder Range Widget

This example uses the title attribute to convey the accessible name.

Example

Example using in-line ARIA markup | HTML source with in-line ARIA
Example using ARIA markup from CLASS attribute information | HTML source of ARIA markup from CLASS attribute

Date Range Slider Example 1: 1900 - 2008

1950

2000

Keyboard Shortcuts

Left / Down: Decrease (one unit)
Right / Up: Increase (one unit)
PgUp / Pgdown: Large change (10 units)
Home: Set slider to minimum
End: Set slider to maximum
Tab: Navigate away from slider

ARIA Roles and Properties

Role: role="role=slider"
States and properties:
- aria-labeledby
- aria-valuenow
- aria-valuemax
- aria-valuemin
- aria-presentation

ARIA Examples