我正在使用Ajax请求创建聊天,我试图让消息div滚动到底部没有太多运气。
我将所有内容都包装在这个div中:
#scroll {
height:400px;
overflow:scroll;
}
是否有一种方法来保持它滚动到底部默认使用JS?
有办法保持它滚动到ajax请求后的底部吗?
我正在使用Ajax请求创建聊天,我试图让消息div滚动到底部没有太多运气。
我将所有内容都包装在这个div中:
#scroll {
height:400px;
overflow:scroll;
}
是否有一种方法来保持它滚动到底部默认使用JS?
有办法保持它滚动到ajax请求后的底部吗?
当前回答
如果你不想依赖scrollHeight,下面的代码可以帮助你:
$('#scroll').scrollTop(1000000);
其他回答
更新的方法,适用于所有当前浏览器:
this.scrollIntoView(false);
Css只有:
.scroll-container {
overflow-anchor: none;
}
使滚动条在添加子元素时不会停留在顶部。例如,当聊天底部添加新消息时,滚动聊天到新消息。
Java脚本:
getElementById(‘messages)文件。scrollIntoView(虚假);
滚动到当前内容的最后一行。
使用jQuery, scrollTop用于为任何给定元素设置scollbar的垂直位置。还有一个漂亮的jquery scrollTo插件,用于滚动动画和不同的选项(演示)
var myDiv = $("#div_id").get(0);
myDiv.scrollTop = myDiv.scrollHeight;
如果你想使用jQuery的animate方法在向下滚动时添加动画,请检查下面的代码片段:
var myDiv = $("#div_id").get(0);
myDiv.animate({
scrollTop: myDiv.scrollHeight
}, 500);
以下是我在我的网站上使用的:
var objDiv = document.getElementById("your_div");
objDiv.scrollTop = objDiv.scrollHeight;