rangeslider.js - Slider Range Polyfill

rangeslider.js es un polyfill para el elemento <input type="range"> de HTML5. 

Hemos probado otros Jquery Range Slider que existen en el mercado como por ejemplo el de jQuery UI y a la hora de la implementación, siempre nos hemos decantado por este, ya que es bastante modificable y sobre todo, da soporte para muchos navegadores.

Sus características son:

1. Compatible con eventos touch
2. Recalcula cuando redimensionamos, lo que lo hace idóneo para responsive design
3. Ligero y rápido
4. Soporta los principales navegadores incluyendo Internet Explorer 8+

Su uso es muy sencillo. Añadimos un input de tipo range:

<input type="range" value="20" data-rangeslider>

Y hacemos la llamada:

var $document = $(document),
    selector = '[data-rangeslider]',
    $inputRange = $(selector);
        
$inputRange.rangeslider({ polyfill: false });

Se verá mejor en el siguiente ejemplo:

See the Pen mygbPV by Pedro Marín (@pedromarin) on CodePen.