聊天并使滚动条设置在底部并附加新消息。

Hello all I am working on a social networking website where I have a chat box. everything is working fine in the chatbox except that I have to reload the div after every 5 seconds to get the new messages which is causing some problems for me like the same database query is going to run over again and again after every 5 seconds. and also the scroller goeson top every time the chatbox reloads i can not set it as to scroll to bottom after every 5 seconds because there may be someone just reading the messages and he will not want to scroll the box back again and again. so in short what i want to ask that is there any other way for geting the new messages in chat box . and if this is the only way can you please tell me how to code for this logic if the scroller is above 10px fromthe bottom of div scroll to bottom and append new messages other wise just append new messages.

Here is my code:

 var autoload1 = setInterval(
    function showthemess1()
    {
    $.ajax({
        type: 'POST',
        url: 'chitchatback2.php', 
        data: {'chattingwith':"<?=$nameIS2['id']?>"},
        success: function(chats){
        $("#chatboxdiv").empty().append(chats);
        } });
    }, 5000);

for making the scroller come to bottom i can do like

   $(".bechmsgbox").animate({
scrollTop: $("#chatboxdiv")[0].scrollHeight
},'slow');

My suggestion is to use sockets for this kind of situations.
try this example as well

I would suggest you explore services such as pusher so that you dont have to keep pulling. http://pusher.com/

you should store latest requested post ID in variable, request only new post and append those.