窗口滚动平滑效果

Question

我有下面的代码，当我们滚动时，弹出窗口居中，它很快将它重新定位到中心。如何获得平滑效果，就好像下降非常平滑一样。

$(window).scroll(function() { 

     var top = ($(window).height() - $('.myPopUp').height())/2 + $(window).scrollTop(); 
     $('.myPopUp').animate({ top: top }, 10); 

}); 

我试图发挥速度，但它的速度相当快。

Answer 1

你只需要增加你的动画时间，目前在10毫秒，这样的：

$(window).scroll(function() { 
    var top = ($(window).height() - $('.myPopUp').height())/2 + $(window).scrollTop(); 
    $('.myPopUp').animate({ top: top }, 200); 
}); 

动画帧在13毫秒的时间间隔，所以10ms的瞬间将改变，给它一个持续时间较长，像200毫秒以上会带来更平滑的效果。为了快速滚动的场景，你可能会想在那里.stop()过，像这样：

$('.myPopUp').stop(true).animate({ top: top }, 200);