700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > html div 自动滚动到底部 javascript让DIV的滚动自动滚动到最底部-4种方法

html div 自动滚动到底部 javascript让DIV的滚动自动滚动到最底部-4种方法

时间:2021-10-18 08:05:01

相关推荐

html div 自动滚动到底部 javascript让DIV的滚动自动滚动到最底部-4种方法

要制作一个在线聊天的程序,在做最后的修饰时,需要对获得的信息即时滚动以保证用户总能看到最新消息。

聊天程序是基于AJAX设计的,没有用框架,消息容器是一个DIV,所以问题就在于如何控制DIV的滚动条。

网上有资料介绍说通过设置scrollTop属性来控制滚动条位置,具体可参见:

方法二:

利用DIV的scrollIntoView方法,将最底端滚动到可视位置 [list=1]function onGetMessage(context){msg.innerHTML+=context;msg_end.scrollIntoView();}《script》

方法三:将滚动条(scrollbar)保持在最底部的方法 - 滚动条, scrollbar, 页面底部, 聊天窗口,

将滚动条(scrollbar)保持在最底部的方法

';p.scrollTop = p.scrollHeight;}《script》请点击“插入一行”按钮,插入最新信息,当出现滚动条时,滚动条将自动保持在底部。

方法4:

这个比较复杂也比较灵活一点,就是利用DIV+JS+图片构造一个滚动条,当然了图片是怎么好看怎么用了。

主要部分就是外层的DIV加个overflow:hidden属性,通过js代码调整内层DIV的margin-left和margin-top来控制内容的滚动,由于上面两种方法已经可以满足需求,所以这种方法没具体做深究,有兴趣的可以试一下

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。