在javascript或jQuery中滾動到具有特定id的html元素

Question

我有分配了id的html元素。現在我想滾動到這些元素。我看到jQuery有一個scrollTop，它需要一個整數值..我怎樣才能輕鬆製作一個特定的HTML元素與ID滾動到頂部？理想的情況下，動畫不錯，流暢。

快速搜索顯示了很多滾動插件...如果上述功能需要插件，那麼最受歡迎的插件是什麼？我也使用jquery-ui。

Answer 1

你可以使用這樣的滾動到#someElement在頁面加載時：

$(document).ready(function() { 
    $("html, body").animate({scrollTop: $("#someElement").offset().top}, 1000); 
}); 

它只是動畫的body元素的scrollTop財產，並使用頂部的一些特定元素的偏移量的位置滾動到。動畫持續1000毫秒。

注意：它同時選擇html和body，因此它適用於所有瀏覽器。我不確定具體情況，但一些快速測試顯示Chrome使用body，但Firefox和IE使用html。

這是working example。

Answer 2

考慮下面的代碼片段：

$('#myDiv').bind('click',function(){ 

    var pos = $(this).offset().top, 
    scrollSpeed = 2; 

    for (var i = pos; i > 0; i=i-scrollSpeed) { 
     $(window).scrollTop(i); 
    } 
}); 

它是滾動綁定到#myDiv元素上點擊只是舉例。代碼確定#myDiv元素的位置，比計算滾動步數（速度/平滑度）。比做jQuery .scrollTop（）的東西。