Sliders

Knobb Validation

Nice, downward compatible, touchable, jQuery dial.

Simple
Display previous value
Disable display input
Angle offset and arc
5-digit values, step 1000
'Cursor' mode

Ion.RangeSlider

jQuery range slider with skin support.

Basic Slider

The basic slider is horizontal and has a single handle that can be moved with the mouse or by using the arrow keys.

Vertical Slider

Change the orientation of the slider to vertical. Assign a height value via .height() or by setting the height through CSS, and set the orientation option to "vertical."

Range Slider

Set the range option to true to capture a range of values with two drag handles. The space between the handles is filled with a different background color to indicate those values are selected.

Range Vertical Slider

Change the orientation of the range slider to vertical. Assign a height value via .height() or by setting the height through CSS, and set the orientation option to "vertical."

Slider Variations

Vertical Variations