The number of handles can be set using the
Snapping between steps
When a non-linear slider has been configured, the
snap option can be set to
true to force the slider to jump between the specified values.
noUiSlider offers several ways to handle user interaction. The range can be set to drag, and handles can
to taps. All these effects are optional, and can be enable by adding their keyword to the behavior option.
option accepts a
"-" separated list of
A handle snaps to a clicked location. A smooth transition is used. This option is
Makes the range draggable. Requires two handles. The
connect option must be set to
Keeps the distance between handles fixed when the
'drag' flag is set.
'behavior' flags can be combined.
With this option set, the slider fires
hover events when a mouse or pen user hovers over
Slider Scales / Pips
This feature allows you to generate points along the slider. Five options can be set:
to determine where to place pips,
values as additional options for
stepped to round pip values to the slider stepping,
density to pre-scale the
number of pips, and
filter to manually modify pip size.
range mode uses the slider range to determine where the pips should be. A pip is
generated for every percentage specified.
steps mode uses the slider range. In
steps mode, a
pip is generated for every step. The
filter option can be used to filter the generated pips.
filter function must return
0 (no value),
1 (large value) or
2 (small value).
Slider Colors - Handles
Slider With date
Slider With Input
Circle Filled Handle
The orientation setting can be used to set the slider to
Set dimensions! Vertical sliders don't assume a default
height, so you'll need to
set one. You can use any unit you want, including