Sliders v10.0.0 - Pro Component

We restyled noUIslider, while keeping the design consistent. You can use other classes for colors like .slider-info, .slider-success, .slider-warning, .slider-danger.

For more information please check Full Github Documentation.

<!-- Markup -->
<div id="sliderRegular" class="slider"></div>
<br>
<div id="sliderDouble" class="slider slider-rose"></div>

<!-- Javascript -->
var slider = document.getElementById('sliderRegular');

noUiSlider.create(slider, {
	start: 40,
	connect: [true,false],
	range: {
		min: 0,
		max: 100
	}
});

var slider2 = document.getElementById('sliderDouble');

noUiSlider.create(slider2, {
	start: [ 20, 60 ],
	connect: true,
	range: {
		min:  0,
		max:  100
	}
});