javascript – 自动滚动div与jQuery到追加后的底部

.messages {
border: 1px solid #dddddd;
padding:10px;
height: 400px;
overflow-x:visible;
overflow-y: scroll;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-bottom:10px;
font-size:14px;
}

对于自动滚屏我使用这样的功能：

receiveMessage = function (name,message,type) {
    //adding new message
    $("#messages").append('<strong>' + name + ": " + '</strong>' + message + '<br>');
    /autoscrolling to the bottom
    $("#messages").animate({
        scrollTop: $("#messages").height()
    },300);
}

大约〜20条消息正常滚动,但在挂起后,新消息不会滚动. Chrome版本19.0.1084.56.我做错了什么？
谢谢！