HTML5 Input Range Polyfill/Unobtrusive Accessible Slider

An Unobtrusive Accessible Slider script that can also be used as an HTML5 Input Range polyfill solution.

At a glance

• The script can be used as an HTML5 range polyfill solution
• Introduces a gradient filled “range bar” for quick visual feedback
• iOS Touch screen friendly
• Arrives with a new CSS3 skin that degrades gracefully in older browsers
• Unobtrusive & namespace friendly
• Conforms to the WAI-ARIA defined role of “slider”
• Keyboard accessible
• Recalculates onresize so suitable for use within responsive designs
• Available under a mixed MIT/GPL2 license

Quick Demos

Apologies to all – none of the online demos currently work as my website is, alas, no more. I am in the process of moving the demos to Github pages, please bear with me!

The demos are bundled with the repo though, so the adventurous can download the source and open the relevant HTML pages in the browser.

• Mixed HTML5 polyfill and Javascript API demo
• Using yepnope and Modernizr to load dependencies only when required for HTML5 polyfills
• CSS generated content tooltip extension