我已经制作了聊天系统,但是在消息滚动的div上遇到了一个问题,即滚动条必须默认在底部。
DIV
<div class="chat-body chat-scroll" id="chat-scroll"></div>
样式
.chat-scroll{position: absolute; top:0px; bottom: 0px; overflow-y: auto;}
我使用JQuery来提交表单输入的信息,以重新加载#chat-scroll的内容,并且自动滚动在提交时可以正常工作,但是当页面首次加载时,滚动条仅停留在#chat-scroll div的中间位置。与之不同的是,如果我发送一条消息,它将会滚动到底部。
JQuery用于滚动
$('#chat-scroll').animate({
scrollTop: $('#chat-scroll').get(0).scrollHeight}, 2000);