HTML5 Multi-handle Range Slider Polyfill Solution – multirange

multirange is a tiny JavaScript polyfill for HTML5 ‘multiple’ range input, with support for Keyboard accessible and customizable slider / handle styles.

How to use it:

Download and include the multirange’ JS & CSS files on the html page.

<link rel="stylesheet" href="multirange.css">
<script src="multirange.js"></script>

Create a ‘multiple’ range input with two sliders on the page.

<input type="range" multiple value="0,100" />

That’s it.

Changelog:

08/19/2018

• Don’t crash if the oninput property is undefined