滾動回div的頂部

<div id="containerDiv"></div>

#containerDiv { 
    position: absolute; 
    top: 0px; 
    width: 400px; 
    height: 100%; 
    padding: 5px; 
    font-size: .875em; 
    overflow-y: scroll; 
}

document.getElementById("containerDiv").innerHTML = variableLongText;

如何滾動位置重置回容器頂部的下一次單嗎？滾動回div的頂部

來源

2012-05-24 imhere

105

var myDiv = document.getElementById('containerDiv'); 
myDiv.innerHTML = variableLongText; 
myDiv.scrollTop = 0;

見scrollTop屬性。

來源

2012-05-24 19:50:31 Phrogz

嘗試過，但沒有奏效。當一個variableLongtext被加載到容器div中，並且正在查看它的中間時，然後滑動到新變量Longtext，它將顯示在容器中，但我們不會查看它的頂部，它已經被滾動向下一點。 – imhere

@ s12345你最好做一個可重現的測試用例，向我們展示你的問題（例如http://jsfiddle.net），並說出你正在經歷的操作系統/瀏覽器/版本。 – Phrogz

對不起我的錯誤..它的作品！與兩個類似的div混淆。 – imhere

另一種方式與流暢的動畫效果做的就是這個樣子

$("#containerDiv").animate({ scrollTop: 0 }, "fast");

來源

2013-11-17 14:02:20

效果很好，但**請**不要使用'slow'，這樣太慢了！ – Pascal

而不是傳遞'slow'作爲第二個參數。您可以傳遞一個整數，該整數將是動畫完成的毫秒數。 –

這是迄今爲止發現的Iv的最佳方式。它看起來不錯，第二個參數設置爲「快速」，1000或500. – ekerner

我想現有的回答這個問題，他們都不在Chrome爲我工作。什麼做的工作是稍有不同：

$('body, html, #containerDiv').scrollTop(0);

來源

2014-12-18 22:17:26

對我來說，scrollTop的方式沒有工作，但我發現其他：

element.style.display = 'none'; 
setTimeout(function() { element.style.display = 'block' }, 100);

雖然沒有檢查可靠的CSS渲染的最短時間，100ms的可能矯枉過正。

來源

2016-11-24 13:38:50 AlexTR

scrollTo

window.scrollTo(0, 0);

是滾動窗口頂端的終極解決方案 - 最好的部分是，它不需要任何id選擇，甚至如果我們用IFRAME結構會非常努力好。

scrollTo（）方法將文檔滾動到指定的座標。
window.scrollTo（xpos，ypos）;
xpos Number必需。沿着x軸（水平）滾動到的座標，以像素爲單位
ypos Number必需。座標滾動到，沿着y軸（垂直），以像素爲單位

的jQuery

另一種選擇做同樣的使用jQuery和它會給用於相同

一個平滑的外觀

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

其中0後scrollTop指定垂直滾動條在像素中的位置，第二個參數是一個可選參數，它顯示完成任務的時間（以微秒爲單位）。

來源

2017-04-10 21:50:43

對於那些仍然無法完成此工作的人，請確保在使用jQuery功能之前顯示已經溢出的元素。

例：

$('#elem').show(); $('#elem').scrollTop(0);

來源

2017-06-12 18:46:39

拯救生命！開始失去與scrollTop不能正常工作的意願！必須將我的scrollTop調用放在setTimeout函數中。 –

如果HTML內容溢出單視，這個工作對我來說只使用JavaScript的：

document.getElementsByTagName('body')[0].scrollTop = 0;

問候，

來源

2017-07-19 14:43:29 Ruben

這爲我工作：

document.getElementById('yourDivID').scrollIntoView();

來源

2018-02-20 10:15:42 Rajat

如果要以平滑過渡進行滾動，您可以使用它！

（香草JS）

const tabScroll = document.getElementById("tabScroll"); 
window.scrollTo({ 
    'behavior': 'smooth', 
    'left': 0, 
    'top': tabScroll.offsetTop - 80 
});

如果你的目標用戶是鉻和火狐，那麼這是好！但不幸的是，這種方法在所有瀏覽器上都不夠好。 Check Here

希望這有助於！

來源

2018-02-23 06:29:18 Ashwin

滾動回div的頂部

回答

相關問題