ion.RangeSlideris Easy,flexible and responsive range slider with skin support.

Basic Demo

Simple start and customising basic params

Start without params

$("#range_01").ionRangeSlider();
Set Value

Set min value,max value and start point

$("#range_02").ionRangeSlider({min:100,max:1000,from:550});
Specify Range

Set type to double and specify range,also showing grid and adding prefix "$"

$("#range_03").ionRangeSlider({type:"double",grid:true,min:0,max:1000,from:200,to:800,prefix:"$"});
Set up range and step

Set up range with negative values

$("#range_04").ionRangeSlider({type:"double",grid:true,min:-1000,max:1000,from:-500,to:500});
Fractional Values

Set up range with fractional values,using fractional step

$("#range_04").ionRangeSlider({type:"double",grid:true,min:-1000,max:1000,from:-500,to:500});
With Strings

One more example with strings

$("#range_09").ionRangeSlider({grid:true,from:3,values:["January","February","March","April","May","June","July","August","September","October","November","December"]});
add