Blazor Range Slider - Keyboard Navigation

The Blazor Range Slider can be accessed through keyboard shortcuts. In the following sample, various key combinations have been used to access the Range Slider functionalities interactively.

The Range Slider has built-in keyboard support and allows you to access its functionalities using a keyboard alone. The supported keys are as follows:

Focus

• Alt + J - Focuses on the first Blazor component of the sample.

Range Slider Navigation

• Right arrow or Up arrow - Increases the value of the Range Slider.
• Left arrow or Down arrow - Decreases the value of the Range Slider.
• Home - Moves to the start value (for Range Slider, when the second thumb is focused and the Home key is pressed, it moves to the first thumb value).
• End - Moves to the end value (for Range Slider, when the first thumb is focused and the End key is pressed, it moves to the second thumb value).
• Page up - Increases the Range Slider value based on the LargeStep value (for Range Slider, when the first thumb is focused and Page Up is pressed, it moves until the second thumb value).
• Page down - Decreases the Range Slider value based on the LargeStep value (for Range Slider, when the second thumb is focused and Page Down is pressed, it moves until the first thumb value).
• Tab - Focus on the Range Slider handle (move focus between handles in the Range Slider).