JQuery：如何使用超時腳本來檢測頁面滾動？

Question

我想知道如何使超時腳本檢測何時scrolltop（）是< = pos.top & & menu.hasClass（'fixed'）），所以菜單可以返回到默認值。

$(function(){ 
var menu = $('#menu'), 
    pos = menu.offset(); 

    $(window).scroll(function(){ 
     if($(this).scrollTop() > pos.top+menu.height() && menu.hasClass('default')){ 
      menu.fadeOut('fast', function(){ 
       $(this).removeClass('default').addClass('fixed').fadeIn('fast'); 
      }); 
     } else if($(this).scrollTop() <= pos.top && menu.hasClass('fixed')){ 
      menu.fadeOut('fast', function(){ 
       $(this).removeClass('fixed').addClass('default').fadeIn('fast'); 
      }); 
     } 
    }); 
    }); 

通常你不會發現這個問題與這個劇本，但我有我的網站建立使用JavaScript來更新div標籤的內容的方式，菜單沒有注意到頁面內容增加或降低高度或寬度（取決於具體情況），並且無法滾動，因此菜單保留在頁面頂部的位置。

Answer 1

這不是一個新問題，看看這個教程，他們通過HTML運行，CSS（3）和jQuery的需要 - http://www.1stwebdesigner.com/tutorials/create-stay-on-top-menu-css3-jquery/

編輯：

從閱讀上述評論它看起來您可能希望檢測不活動，然後將用戶滾動到頁面的頂部。這使問題更加有趣。

$(function(){ 

    var menu = $('#menu'), 
    pos = menu.offset(); 
    var timer = setTimeout('scrollToTop()', 30000); 

    $(window).scroll(function(){ 
     // scrolling has happened, reset any timers 
     clearTimeout(timer); 
     timer = setTimeout('scrollToTop()', 30000); 
     if($(this).scrollTop() > pos.top+menu.height() && menu.hasClass('default')){ 
      menu.fadeOut('fast', function(){ 
       $(this).removeClass('default').addClass('fixed').fadeIn('fast'); 
      }); 
     } else if($(this).scrollTop() <= pos.top && menu.hasClass('fixed')){ 
      menu.fadeOut('fast', function(){ 
       $(this).removeClass('fixed').addClass('default').fadeIn('fast'); 
      }); 
     } 
    }); 
}); 

// if 30 seconds elapses with no scrolling scroll to top 
function scrollToTop() { 
    window.scroll(0,0); 
}