All Components

Keyboard Navigation

The keyboard navigation of the Slider is always available.

The Slider supports the following keyboard shortcuts:

SHORTCUT DESCRIPTION
Upper Arrow & Right Arrow keys Increases the displayed Slider value with a small step.
Down Arrow & Left Arrow keys Decreases the displayed Slider value with a small step.
Page Up Increases the displayed Slider value with a large step.
Page Down Decreases the displayed Slider value with a large step.
Home Sets the Slider to its minimum value.
End Sets the Slider to its maximum value.
Tab (Accessibility mode) Focuses the handle element.
@Component({
    selector: 'my-app',
    template: `
    <kendo-slider
        [min]="min"
        [max]="max"
        [smallStep]="smallStep"
        [largeStep]="largeStep"
        [(ngModel)] = "value"
    ></kendo-slider>
    `
})

class AppComponent {
    public value: number = 5;
    public min: number = 0;
    public max: number = 10;
    public smallStep: number = 1;
    public largeStep: number = 2;
}
In this article