Question

I have an slider with id=”slider” I currently write a log when the slider changes position. This is my code:

$("#slider").slider({
    value:40,
    min: 0,
    max: 80,
    step: 10,
    slide: function( event, ui ) {
        console.log('moved'); // Run code if slider value changes
        }
    });

I also know how to run some code when the user releases/mouseup the handle:

$("#slider .ui-slider-handle").click({
    console.log('released handle');
    });

My problem is that with my currenty implementation I run the code everytime the user moves the handle, and sometimes he still is moving the handle and hasn’t decided what is it’s final position. I need to run some code when the user has finished with the slider. Am I clear on what I need to do? How can this be done?

Answer 1

$("#slider").slider({
    value:40,
    min: 0,
    max: 80,
    step: 10,
    slide: function( event, ui ) {
        console.log('moved'); // Run code if slider value changes
    },
    stop: function(event, ui) {
        console.log('released handle');
    }
});