How to detect when scrolling has finished in Jquery?

Question

I'm trying to execute a function after the user has stopped scrolling on my website but I'm having trouble finding a solution on how to detect when the user has stopped scrolling...

This is the function I'm using

$(window).on('scroll', function() {
   existingFunction();
   //code to be executed when the scroll has finished
});

Is there like an event or something I can check to see if the scroll has completed?

Check this question out: https://stackoverflow.com/questions/3701311/event-when-user-stops-scrolling — justDan, Oct 27 '17 at 18:13
@DanielD with this I'm essentially setting a timer once the actions has completed to execute the function? — , Oct 27 '17 at 18:16
Yep that's what it seems like to me. So you could use it like this: http://jsfiddle.net/j2grezwL/2/ (fire up the console to see it call the function) — justDan, Oct 27 '17 at 18:19

score 0 · Answer 1 · answered Oct 27 '17 at 18:33

on scroll happens when you scroll so if you want to check if a user stop to scroll you need to use timers.

if 1 second delay is not good just change it but this is the basic idea

var now = null;

function startInterval(){
 var interval = setInterval(function(){
    if(Date.now() > now +1000){
        clearInterval(interval)
        now = null;
        existingFunction();
    }
  },1000)
}
function existingFunction(){
 console.log('finish')
}
$(window).on('scroll', function() {
  if(now === null){
     now = Date.now()
     startInterval()
  }
  else{
  now = Date.now()
  }

});

How to detect when scrolling has finished in Jquery?

1 Answers1