Mike Mike - 3 months ago 16
jQuery Question

How to enable some time delay to trigger JQuery Slider function?

I implemented a slider in my jsp page and the code is as this,

$('#slider1').slider({
range: "min",
value: myvalue,
min: 0,
max: 57,
slide: function(event, ui) {
/*
my backend function go here
*/
}
});


I want to add a "mouse up time" so that after user click the slider and then pause for certain seconds, the slide function will then be triggered. I don't want the function to be triggered immediately after user release button. This makes sure that user is paused to see the function happens.

Thanks

Mike

Answer

You can use a setTimeout to introduce a delay. See jsfiddle.

// ...
slide: function(event, ui) {
  setTimeout(function() { sliderMethod(event, ui); }, 2000); // delay trigger for 2s
}
//..
function sliderMethod(event, ui) {
  /*
    my backend function go here
  */
}
Comments