Transforms a <select> containing one or more <optgroup> in two chained <select>.

Check out Github

Launch modal examples

Basic Setup

Input control is attached to slider

Working with dates

dates to numerical ranges, and then use the update event to display them in a pretty format.

Moving the slider by clicking pips

Slider With Tooltip

always show slider values.

Using HTML5 input elements

noUiSlider's 'update' method is useful for synchronizing with other elements

Soft Limits

If you want to disable the edges of a slider, the set event can be used to reset the value if a limit is passed.

Vertical Slider

Vertical orientation slider example