NOUI-Slider

by Jhim Preston

HTML

<body>
<script src="http://proyector.labiblia.in/js/nouislider.min.js"></script>
<link rel="stylesheet" href="http://proyector.labiblia.in/css/nouislider.min.css">
<style>
.noUi-connect, #slider{ background-color:#003366;border-radius:100px;
box-shadow: 1px 2px 20px  #838689;}
</style>

<div id="slider" style="margin-left:15px;margin-right:15px;	background: #336699;border:0px;"></div>

<div id="valor"></div>
<script>
var slider = document.getElementById('slider');
noUiSlider.create(slider, {
	start: [ 80 ],
  connect: [true,false],
	range: {
		'min': [   0 ],
		'max': [ 100 ]
	}

});
slider.noUiSlider.on('update', function( values, handle ) {
//	document.getElementById('valor').innerHTML= values[handle];
});


</script>
</body>