2013-05-10 104 views
2

根據頁面的垂直滾動角滾動我移動<div>稱爲container水平:平滑跨瀏覽器使用jQuery

scrollElement.scroll(function() { 
    var offsetLeft = scrollElement.scrollTop()/x; 
    container.css({ left: offsetLeft + 'px' }); 
}); 

這成功地創建了一個角滾動效果,當用戶垂直滾動。

的滾動是在Firefox勉強可以接受,但很跳動在谷歌瀏覽器:Chrome瀏覽器出現故障時,您滾動太快,因此第一向下滾動同步在x運動和y軸,然後調整x -抵消。 但是,當您滾動過快時,Firefox會滯後。

有沒有更好的方法來實現這個「對角滾動」? 是否可以使它更平滑?

我基本上希望div不要每次修正x座標都不要向下滾動太多。

回答

0

您可以嘗試它作爲動畫,而不是直接設置容器偏移的CSS。

scrollElement.scroll(function() { 
    var offsetLeft = scrollElement.scrollTop()/x; 

    container.stop(true, false); // Stop the current animation, likely 
           // caused by a previous scroll event fire. 
    container.animate({ left: offsetLeft + 'px' }); 
}); 
+0

謝謝。不幸的是,這加劇了第一次向下滾動然後離開的效果。我正在尋找一種方法來同步這些動作。 – 2013-05-10 07:16:19