自动滚动到底部DIV

时间:2014-07-16 04:57:20

标签: jquery css

我已经建立了聊天系统,但是滚动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的内容 并且自动滚动可以提交,但是在第一次加载页面时,滚动只停留在div#chat-scroll的中间。与我提交消息时不同,当我发送消息时它将会显示在底部。

用于滚动的JQuery

$('#chat-scroll').animate({
scrollTop: $('#chat-scroll').get(0).scrollHeight}, 2000);                   

2 个答案:

答案 0 :(得分:20)

当窗口加载时,使用document.ready

在底部滚动聊天div

DEMO

$(document).ready(function() {
    $('#chat-scroll').animate({
        scrollTop: $('#chat-scroll').get(0).scrollHeight
    }, 2000);
});

答案 1 :(得分:1)

var objDiv = document.getElementById("your_div");
objDiv.scrollTop = objDiv.scrollHeight;