滾動到元素的頂部時，靠近窗戶

Question

我想達到的頂部以下內容：

我有一個div，當它在我要自動滾動到這個div的頂部頁面頂部幾乎是。

這是我到目前爲止的腳本。正如你所看到的（我希望）。當#plus在頁面頂部250到20 px之間時，我想運行位於頁面頂部的#editions的動畫。但是，動畫執行很多次，並且一直持續。我認爲它在250到20之間的範圍內的每個值都被觸發，因此基本上是230次。我不知道我是否以正確的方式開展這項工作。

// Scroll to Editions // 
function scrollEditions(){ 
    $('html, body').animate({ 
    scrollTop: $("#plus").offset().top 
}, 1200, 'easeOutQuint').delay(200).animate({ 
    scrollTop: $("#editions").offset(). 
    }, 800, 'easeOutQuint'); 
}; 

// Scrolling check // 
function showHideTitles(){ 
    // Distance of elements frop top // 
    var Ptop2 = Math.round($('#plus').offset().top - $(window).scrollTop());  // PLUS from top 

    // Auto scrolling // 
    if (Ptop2 <= 240 && Ptop2 >= 20){ 
     scrollEditions(); 
    } 
}; 

$(window).scroll(function(){ 
    showHideTitles() 
}); 

Answer 1

如果你正在自己實現，你會希望使用防抖動功能在給定的時間間隔內，一旦觸發你的行動。

http://underscorejs.org/#debounce

http://jsfiddle.net/puleos/j67eG/40/

var fn = _.debounce(showHideTitles, 300); 

$(window).scroll(fn); 

如果你想要一個jQuery庫來處理滾動事件的航點是相當不錯的。
http://imakewebthings.com/jquery-waypoints/