html5slider

a JavaScript implementation of HTML5 <input type=range> for Firefox

html5slider is a polyfill that:

• transforms all <input type=range> elements from plain textboxes to draggable sliders on-the-fly automatically,
• supports min, max, step, oninput, and onchange,
• and is the only polyfill that provides native styling for the slider widgets.

Firefox 23 added built-in support for this widget, so this polyfill only applies to Firefox 16 - 22.

Try out a live demo!

To use html5slider, simply reference html5slider.js in your page as an external script. For example: <script src="html5slider.js"></script>

The source code is available under the MIT license.

For more information about HTML5 and <input type=range>, check out the fantastic online guide "Dive Into HTML5" by Mark Pilgrim: http://diveintohtml5.info/forms.html#type-range

For more HTML5 polyfills and shims, check out this collection: http://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills