ion.RangeSlider is Easy, flexible and responsive range slider with skin support.
Simple start and customising basic params
Start without params
$("#range_01").ionRangeSlider();
Set min value, max value and start point
$("#range_02").ionRangeSlider({ min: 100, max: 1000, from: 550 });
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 with negative values
$("#range_04").ionRangeSlider({ type: "double", grid: true, min: -1000, max: 1000, from: -500, to: 500 });
Set up range with fractional values, using fractional step
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" ] });
Customize & Preview in Real Time
Menu Color
Menu Background Color
Menu Selection
Navbar Color