Sliders

Custom component

Sliders are a custom GEL component.

JavaScript required

The slider requires the noUiSlider JavaScript library.
There is also a React component available for noUiSlider.

A slider, also known as a track bar, allows users to set or adjust a value.

The basic slider has a single handle that can be moved with the mouse, by pressing and dragging (if touchscreen), or by using the keyboard’s arrow keys.

When the user changes the value, it does not change the format of the interface or other info on the screen. Sliders can be horizontal or veritcal, depending on the user interface.

Read more about noUiSlider.

Horizontal

Vertical

Third-party Content Disclaimer