Wednesday, January 9, 2013

Detecting When Scrolling Stops

There isn't a scrollstop listening event, so how can you call a function when the browser stops scrolling? The trick is to use setTimeout() to a call a function and then clearing the timer every time the page scrolls. When the page finishes scrolling the timer will not be cleared the final time and the function will execute. Here is a sample fiddle.

var timer;     
$(window).scroll(function(e){
         clearTimeout(timer);
         $('#search_tab').fadeOut('slow');
         timer = setTimeout(checkStop,150);
 });

function checkStop(){
  $('#search_tab').fadeIn('slow');
}