Ionică Bizău Ionică Bizău - 1 year ago 142
CSS Question

Prevent ionRangeSlider to change the value after mouse out

In this JSFiddle, hold down the mouse key and drag outside of the JSFiddle result iframe.

Then release the button. Move the mouse over the slider. Then, the slider value will be changed, without holding down the button.

How to prevent this behavior?

The code is pretty simple:

var $range = $(".js-range-slider");

type: "double",
min: 100,
max: 1000,
from: 300,
to: 800

Answer Source

First, assign ionRangeSlider to one variable, read docs

var slider = $(".js-range-slider").data("ionRangeSlider");

so, the slider object has the property dragging: true

once, you can mouseout from the main container, make dragging: false

var slider = $(".js-range-slider").data("ionRangeSlider");

  slider.dragging = false;

check jsfiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download