用緩動動畫代替滾動

Question

我一直在努力用美麗的緩動動畫替換默認的$(window).scroll()行爲。但到目前爲止沒有運氣。以下是我的代碼。

$(window).scroll(function(e){ 
    e.preventDefault(); 

    var cp=$(window).scrollTop(); // current scroll position 

    //animate with custom easing 
    $('html, body').animate({scrollTop:cp}, 50,'easeInElastic'); 

}); 

但這不起作用。它只是滾動1-3像素，非常慢。

如果我將其更改爲$('html, body').animate({scrollTop:500}, 50,'easeInElastic'); 它只是做了一次，那不是我想要的。

我想在用戶按下滾動條按鈕時用緩動動畫代替標準滾動行爲。

的jsfiddle鏈接http://jsfiddle.net/bfDrp/

Answer 1

看看這個插件：

http://manos.malihu.gr/jquery-custom-content-scroller/

這裏是implemintation：

<script> 
(function($){ 
    $(document).ready(function(){ 
     $("body").mCustomScrollbar(); 
    }); 
})(jQuery); 

Answer 2

使用.S crollTo在那個位置的功能，你也可以使用scrollX 和scrollY與窗口。

window.scrollTo(0,150,500);