js滚动条到最底端控制制作聊天室必备

当聊天室的内容超出页面范围时,
如何让页面刷新后
显示最下面的内容

document.getElementById ( 'chatboard').scrollTop=document.getElementById ( 'chatboard').scrollHeight ;

chatboard 为显示容器的id

滚动样式:
<STYLE>
BODY {
SCROLLBAR-FACE-COLOR: #f892cc;
SCROLLBAR-HIGHLIGHT-COLOR: #f256c6;
SCROLLBAR-SHADOW-COLOR: #fd76c2;
SCROLLBAR-3DLIGHT-COLOR: #fd76c2;
SCROLLBAR-ARROW-COLOR: #fd76c2;
SCROLLBAR-TRACK-COLOR: #fd76c2;
SCROLLBAR-DARKSHADOW-COLOR: #f629b9;
SCROLLBAR-BASE-COLOR: #e9cfe0
}
</STYLE> 代码说明:
SCROLLBAR-FACE-COLOR: 滚动条凸出部分的颜色
SCROLLBAR-HIGHLIGHT-COLOR: 滚动条空白部分的颜色
SCROLLBAR-SHADOW-COLOR: 立体滚动条阴影的颜色
SCROLLBAR-3DLIGHT-COLOR: 滚动条亮边的颜色
SCROLLBAR-ARROW-COLOR: 上下按钮上三角箭头的颜色
SCROLLBAR-TRACK-COLOR: 滚动条的背景颜色
SCROLLBAR-DARKSHADOW-COLOR: 滚动条强阴影的颜色
SCROLLBAR-BASE-COLOR:

JS控制滚动条的位置:
window.scrollTo(x,y);

竖向滚动条置顶(window.scrollTo(0,0);
竖向滚动条置底 window.scrollTo(0,document.body.scrollHeight)

JS控制TextArea滚动条自动滚动到最下部

document.getElementById('textarea').scrollTop = document.getElementById('textarea').scrollHeight;

原文地址:https://www.cnblogs.com/zxjyuan/p/1827922.html