Animate scrollTop但我不能使用$（'html，body'）。animate（{scrollTop：0}，'slow'）;

我對jQuery很新，所以請不要介意我的愚蠢。

我有這種風格

html, body{ 
    height: 100%; 
    overflow: auto; 
}

而這個腳本

$(document).ready(function() { 
    $('#guide-wrap').scrollTop($('#main').position().top); 
});

所以當窗口負載，它跳到div ID爲main 我希望它動畫但因爲我有height: 100%; overflow: auto;我不能使用這個腳本：

$('html,body').animate({scrollTop: 0}, 'slow');

或者我可能不知道該怎麼做。我知道這對你們來說可能看起來很明顯，但我很新，而且我之前決定在這裏發佈很多谷歌。請任何人幫助我。

來源

2017-09-06 Sovai

它沒有動畫，並與'溢出：汽車''scrollTop：0'無法找到'＃主要' – Sovai

$('html, body').animate({scrollTop: 0}, 'slow');是動畫滾動的完美代碼。但是，將動畫滾動到$(document).ready()上的頁面頂部是沒有意義的，因爲自動默認爲最高。

如果你正在尋找的滾動來觸發一個超級鏈接點擊，你需要記住傳遞e.preventDefault()點擊事件，以阻止默認行爲。如果鏈接指向相同的頁面（例如#），它將跳轉到頂端，除非這種行爲被阻止。

這裏的工作示例（向下滾動才能看到該鏈接）：

$(".scroll-top").on("click", function(e){ 
 
    e.preventDefault(); 
 
    $('html, body').animate({scrollTop: 0}, 'slow'); 
 
});

.tall { 
 
    height: 200vh; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="tall">Top of the page</div> 
 

 
<a href=# class="scroll-top">Scroll Up</a>

希望這有助於！ :)

來源

2017-09-06 02:32:28

你好黑曜石時代，謝謝你的簡單，但作品的答案。 e.preventDefault（）;解決了這個問題。 – Sovai

$("html, body").animate({ scrollTop: $("#main").offset().top }, "slow");

來源

2017-09-06 02:29:18 BrandonW

你好BrandonW，謝謝你的答案。看起來它應該有效，但我不知道爲什麼，它什麼都不做。我重新加載了頁面，但似乎沒有發生任何事情。 – Sovai

這取決於用例。在頁面加載時很少使用它，就像瀏覽器實際上在頁面的較低位置重新加載一樣，這是不可靠的。或者你正在使用像燼寶這樣的框架。在超鏈接中，它與e.preventDefault（）更相關，或者通過單擊按鈕觸發操作。 – BrandonW

謝謝你BrandonW。 e.preventDefault（）可以做到這一點。 – Sovai

Animate scrollTop但我不能使用$（'html，body'）。animate（{scrollTop：0}，'slow'）;

回答

相關問題