non possono ottenere rangeslider.js a lavorare

Question

Sto cercando di utilizzare il rangeslider plugin jQuery: http://andreruffert.github.io/rangeslider.js/

Tuttavia, non sembra funzionare. Che cosa sto facendo di sbagliato?

<input 
    type="range" 
    min="10"     // default 0 
    max="1000"     // default 100 
    step="10"     // default 1 
    value="300"     // default min + (max-min)/2 
    data-orientation="vertical" // default horizontal 
> 

$(document).ready(function() { 
    $('input[type="range"]').rangeslider(); 
}); 

Jsfiddle: http://jsfiddle.net/8n2ckkmr/

Answer 1

La risposta reale è giù per l'opzione polyfill;

Il rilevamento delle funzioni è il valore predefinito true. Impostare su false su se si desidera utilizzare il polyfill anche in Browser che supportano il tipo di input nativo nativo >.

Ecco un modo semplice per iniziare:

$('input[type="range"]').rangeslider({ 
    polyfill : false, 
    onInit : function() { 
     this.output = $('<div class="range-output" />').insertAfter(this.$range).html(this.$element.val()); 
    }, 
    onSlide : function(position, value) { 
     this.output.html(value); 
    } 
}); 

Answer 2

ha funzionato per me anche, ma solo sul documento pronto

$(document).ready(function() { 
     $('[role="range"]').rangeslider({ 
      polyfill : false, 
      onInit : function() { 
       this.output = $('[role="input-range"]').html(this.$element.val()); 
      }, 
      onSlide : function(position, value) { 
       this.output.html(value); 
      } 
     }); 
    });