Создание чата AJAX с расширенными функциями прокрутки.Как?

Question

Мне нужно несколько примеров использования для этого.У меня есть немного HTML:

<div id="chatDisplay">
</div>
<input type="text" id="message" /><input type="button" id="send" value="Send" />

Затем у меня есть JQuery:

// This function sets up the ajax that posts chat messages to the server.
$(function()
{
     $('#send').click(function ()
     {
          $.ajax(
          {
               url: "chat/postmsg",,
               data: { msg: $('#message').val(); },
               type: "POST",
               success: function (response)
               {
                    // Server sends back formated html to append to chatDisplay.
                    $('#chatDisplay').append(response);
                    //scroll to bottom of chatDisplay
               }
          });
     });
});

// This function periodically checks the server for updates to the chat.
$(function ()
{
     setInterval(function()
     {
          $.ajax(
          {
               url: "chat/getupdates",
               type: "POST",
               success: function (response)
               {
                         // Server sends back any new updates since last check.
                         // Perform scroll and data display functions. Pseudo-code to follow:

                         // If (chatDisplay is scrolled to bottom)
                         // {
                         //     append response to chatDisplay
                         //     scroll to bottom of chatDisplay
                         // }
                         // else if (chatDisplay is scrolled up from bottom by any amount)
                         // {
                         //     append response to chatDisplay, but do not scroll to bottom.
                         // }
               }
          });
     }, 7000);
});

Это всего лишь пример основных функций чата, за исключением, конечно, кода на стороне сервера.Что мне нужно, это пример использования того, как выполнить то, что описывает псевдокод.Как определить, прокручивается ли пользователь до нижней части DIV, и как прокрутить его до нижней части?Я не хочу, чтобы они переходили в конец DIV, если они прокручиваются вверх, чтобы посмотреть историю чата.

Я слышал о плагине ScrollTo в JQuery, но просто нужны некоторые примеры.

Заранее спасибо!

РЕДАКТИРОВАТЬ: Вот решение для заинтересованных.

success: function (response)
{
     var elem = $('#chatDisplay');
     var atBottom = (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight());
     $('#chatDisplay').append(response);
     if (atBottom)
          $('#chatDisplay').scrollTop($('#chatDisplay')[0].scrollHeight);
}

Перейти к http://www.jsfiddle.net/f4YFL/4/ для примера этогов действии.

Answer 1

Похоже, что вы можете изменить свой псевдокод на это:

добавить ответ к chatDisplay if (chatDisplay внизу) {прокрутить к низу}

Вот ссылка начтобы определить, прокручиваете ли вы до конца:

http://yelotofu.com/2008/10/jquery-how-to-tell-if-youre-scroll-to-bottom/

Надеюсь, это поможет.

Боб