滚动回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的顶部

回答

相关问题