滚动到元素的顶部时，靠近窗户

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/