jQuery滚动事件

Question

我正在尝试以下jQuery代码.
当我向上或向下滚动时,我想要fadeOut一个div,当滚动停止fadeIn相同的div时.

我有的是这个:

$(document).ready(function(){
   $(window).scroll(function(e){
     $('#search_tab').fadeOut('slow'); 
   }); 
});

我知道fadeOut滚动开始时这将是div,但是一旦我停止滚动,诀窍就是淡化它.

现在,我已经看到了这一点(但仍然不是我想要的)

    //Firefox
 $('#elem').bind('DOMMouseScroll', function(e){
     if(e.detail > 0) {
         //scroll down
         console.log('Down');
     }else {
         //scroll up
         console.log('Up');
     }

     //prevent page fom scrolling
     return false;
 });

上述功能根本不起作用如下:

 $(window).bind('DOMMouseScroll', function(e){
     if(e.detail > 0) {
         //scroll down
         $('#search_tab').fadeOut('slow');
     }else {
         //scroll up
         $('#search_tab').fadeOut('slow');
     }

     //prevent page fom scrolling
     return false;
 });

Answer 1

没有scrollstop侦听事件，但您可以通过使用函数来模拟一个侦听事件setTimeout()，然后timer在每次页面滚动时清除该事件。这是一个小提琴样本。

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

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