Input type="range" polyfill (slider control)

Purpose

The <input type="range" /> element enables the display of a slider control bar. Because some browsers do not support this functionality natively, this polyfill emulates the same functionality using generic HTML and WAI-ARIA.

Working example

• English examples
• French examples

How to implement

To use the polyfill, a standard input type="range" element must be used. In cases where a browser doesn't support the input type="range" element, the polyfill is automatically loaded.

Configuration options

Configuration options available for the input type="range" element (HTML5 specification)

Events

$( document ).on( "wb-ready.wb-slider", "input[type='range']", function( event ) {
});

$( "input[type='range']" ).on( "wb-ready.wb-slider", function( event ) {
});

$( document ).on( "wb-updated.wb-slider", "input[type='range']", function( event ) {
});

$( "input[type='range']" ).on( "wb-updated.wb-slider", function( event ) {
});

$( document ).on( "wb-ready.wb", function( event ) {
});

Source code

Input type="range" polyfill source code on GitHub