How to add delay to jquery mouseover? [duplicate]
You can use setTimeout
var delay=1000, setTimeoutConst;$('.img').on('hover', function() { setTimeoutConst = setTimeout(function() { // do something }, delay);}, function() { clearTimeout(setTimeoutConst);});
You could do that using a setTimeout
along with a clearTimeout
if the user leaves too soon:
var timer;var delay = 1000;$('#element').hover(function() { // on mouse in, start a timeout timer = setTimeout(function() { // do your stuff here }, delay);}, function() { // on mouse out, cancel the timer clearTimeout(timer);});
Use a timer and clear it when they mouseout incase they leave within 1000ms
var timer;$('.img').on({ 'mouseover': function () { timer = setTimeout(function () { // do stuff }, 1000); }, 'mouseout' : function () { clearTimeout(timer); }});