Best jQuery Range Slider Plugins & Tutorials with Demo

roundSlider : jQuery Circular Range Slider

roundSlider : jQuery Circular Range Slider

Round slider (also can call as Circular slider, Radial slider) is a jQuery plugin that allows the user to select a value or range of values.

Not only a round slider, it supports the quarter, half and pie circle shapes also.

mb.valueSlider : jQuery Value Slider Plugin

mb.valueSlider : jQuery Value Slider Plugin

jquery.mb.valueSlider let you set a range between two numbers (positive or negative) and catch a value by dragging a cursor.

jQuery Lcn Circle Range Select

jQuery Lcn Circle Range Select

jQuery Lcn is a 360 degree circle range select input widget.

jQuery UI Slider Pips

jQuery UI Slider Pips

This plugin extends the jQuery UI Slider widget.Plugin for adding little ‘pips’ , ‘floats’ and labels to a slider.

Rangestepper.js : jQuery plugin Snappable Range Input

Rangestepper.js : jQuery plugin Snappable Range Input

Rangestepper.js is a jQuery plugin that creates a highly css style-able snappable range input.

jRange : jQuery Range Selector Plugin

jRange : jQuery Range Selector Plugin

jRange is a jQuery plugin to create range selector.

Circular Slider – A jQuery Plugin

Circular Slider - A jQuery Plugin

Circular slider is a jQuery plugin which helps to slide range of values and images. It supports half(top/bottom/up/down) and full circle shapes.

Nestoria Sliders : jQuery Range Slider Plugin

Nestoria Sliders : jQuery Range Slider Plugin

Fully customizable with CSS, Single/Double handles, Touch-enabled, IE 7+ Compatibility, Custom Digit Rounding, Non linear step increments!

jQuery UI Slider Pips

jQuery UI Slider Pips

jQuery plugin for adding little ‘pips’ , ‘floats’ and labels to a slider.

Features:

  • Adds small “pips” and “labels” to the slider
  • Extends the jQuery UI Slider widget
  • Easily Configurable
  • Works for both Horizontal and Vertical sliders
  • Doesn’t change default slider behaviour
  • Purely a visual plugin

Powerange : iOS 7 style range slider

Powerange : iOS 7 style range slider

Powerange is a range slider control, inspired heavily by iOS 7 and the “Power Rangers” TV series. It is easily customizable, both by CSS and JavaScript. With it’s many features, including changing color and overall style, switching between horizontal and vertical style, custom min, max and start values, custom step interval, displaying decimal values, displaying icons instead of min/max numbers, it is a really powerful UI tool to use on your website.