andreruffert / rangeslider.js

🎚 HTML5 input range slider element jQuery polyfill
https://rangeslider.js.org
MIT License
2.16k stars 401 forks source link

rangeslider.js does not fire callback? #150

Closed q2apro closed 9 years ago

q2apro commented 9 years ago

I am using:

    $('input[type="range"]').rangeslider({
        onInit: function() {
            console.log('test');
        },
        onSlide: function(position, value) {
            console.log(position, value);
        },
        onSlideEnd: function(position, value) {
            console.log(position, value);
        }
    });

The slider is created, however, there are no callbacks on interaction with the slider. What am I doing wrong?

PS: I think it is weird that http://andreruffert.github.io/rangeslider.js/ is using no callbacks in the examples, instead they update by a custom function valueOutput().

andreruffert commented 9 years ago

The slider is created, however, there are no callbacks on interaction with the slider. What am I doing wrong?

First of all what browser are you using? I guess the browser supports the native <input type="range"> element... If you wanna use the polyfill as well for browsers with native <input type="range"> support you have to pass the option polyfill: false e.g.

$('input[type="range"]').rangeslider({
  polyfill: false
});

PS: I think it is weird that http://andreruffert.github.io/rangeslider.js/ is using no callbacks in the examples, instead they update by a custom function valueOutput().

The callbacks are optional you can use them or not its up to you. I just prefer using the standard HTML input methods.

q2apro commented 9 years ago

Firefox 38

I guess the browser supports the native element...

That was the case, thanks for pointing out. Maybe you could add a console message for developers that the browser supports the native element? Would be helpful to understand why it is not working.

With polyfill: false it works as expected, thank you :)