The CSS is backwards compatible, but if you want to use the new introduced orientation support make sure to update to the latest CSS. There are some new modifiers .rangeslider--horizontal& .rangeslider--vertical.

Programmatic attribute changes

Since release v1.2.0 it's possible to react to attribute changes. Useful if you want to change e.g the min or max attribute etc.

// a `input[type="range"]` elementvar$inputRange=$('input[type="range"]');// update some attribute$inputRange.attr('min',10);// by simply calling the `update` method// with argument `true` it will consider// the changed attributes and update the rangelider instance.$inputRange.rangeslider('update',true);

Update to v1.0.0

Before this release rangeslider.js fired a change event everytime the handle was moved. With v1.0.0 we made some changes to fire the change event only on handle release and a input event if the handle is moving. The functionality is now like the native Browser implementation for <input type="range"> elements.

Ok! What do I have to do that everything works like before?

Basically you only have to do some changes in your code if you are listening to a change event to immediately update e.g. an value output etc.

If so simply replace the change event with an input event. That's it!

$document.on('change','input[type="range"]',function(e){// Do something on handle release.});

$document.on('input','input[type="range"]',function(e){// Do something if the handle is moving.});

If you still have questions feel free to visit the gitter room for support.