Here you can download my example of the slider.
HTML:
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="/index.js"></script> <script type="text/javascript" src="/knockout-3.2.0.js"></script> <script type="text/javascript" src="/jquery-2.1.1.js"></script> <script type="text/javascript" src="/jquery-ui.js"></script> <link href="/jquery-ui.css" rel="stylesheet"></link> </head> <body onload="startSlider()"> <h2 class="demoHeaders">Slider</h2> <div id="slider"></div> </body> </html>
JS:
var startSlider = function () { $( "#slider" ).slider({ range: "min" }); }
Example taken from here, and here.
HTML5 example:
<!DOCTYPE html> <html> <head> </head> <body> <input type="range" name="points" min="0" max="10"> <body> </html>
Example taken from here.