scrollTop無法正常使用.animate

我有一個包含溢出文本的div，我想通過點擊相應的按鈕來滾動瀏覽。它被設置爲在任一方向滾動100個像素。這個函數在我使用它時不會使用jQuery .animate。scrollTop無法正常使用.animate

$(function() { 
    $("#upBtn").click(function(){ 
    $('#scroll').scrollTop($('#scroll').scrollTop()-100); 
}); 

$("#downBtn").click(function(){ 
    $('#scroll').scrollTop($('#scroll').scrollTop()+100); 
});

但是，一旦我添加.animate，我只能在任一方向點擊一次按鈕。它不會讓我向下滾動超過前100個像素。

$("#scroll").animate({ scrollTop: "100px" });

有什麼建議嗎？ I put together a codepen.

來源

2016-07-29 Alan C

是的，這是正確的行爲！

爲什麼？

因爲這已經是100px，所以它不會進一步滾動。

應該怎樣做：

你可以得到當前滾動頂部位置，並添加100px的給它。如下所示：

$("#scroll").animate({ scrollTop: $("#scroll").scrollTop() + 100 });

其他方式也一樣。

來源

2016-07-29 16:54:26 Jai

感謝您的回覆。您的解釋非常有意義我嘗試了這一點，但是現在再次單擊向下按鈕，現在可以滾動到DIV中文本的末尾而無需任何動畫。向上按鈕也起作用，但沒有動畫。 [更新CodePen]（http://codepen.io/alanc242/pen/GqBAjp） –

scrollTop無法正常使用.animate

回答

相關問題