Короткая прокрутка прокрутки DIV остановлена - PullRequest
Новая
       5

Короткая прокрутка прокрутки DIV остановлена

1 голос
/ 22 июня 2011

Я пытаюсь сделать DIV для прокрутки окна чата при переполнении, но, к сожалению, он останавливается, и я не знаю почему.Вот мой код

Может кто-нибудь сказать мне, что не так и как это исправить?Прямо сейчас происходит то, что он на некоторое время прокручивается вниз, но затем перестает прокручиваться.Я застрял на этой проблеме в течение почти часа.

1 Ответ

2 голосов
/ 22 июня 2011

Хотя в данный момент я не уверен, почему ваша попытка не удалась (хотя я предполагаю, что это проблема с переменной CHATBOX_ID, но это только потому, что вы не показали, откуда она), эта версия работает. Хотя и с парой предположений (которые я объясню позже): 

var chatContentHeight, scrollVal;
var chatHeight = $('#chat').height();

$('#message').keyup(

function(e) {
    chatContentHeight = 0;
    if (e.keyCode == '13') { // assuming you want messages submitted on hitting 'enter'
        newMsg = $(this).val();
        $('<div />').text(newMsg).appendTo('#chat');
        $(this).val('');

        $('#chat > div').each(

        function() {
            chatContentHeight = chatContentHeight + $(this).outerHeight();
        });

        if (chatContentHeight > chatHeight) { // checking whether or not scrolling is needed
            scrollVal = (chatContentHeight - chatHeight); // defines the amount to scroll
            $('#chat').scrollTop(scrollVal);
        }
    }
});

JS Fiddle demo .

Мои предположения:

  1. что вы хотите сообщения, отправленные при нажатии введите ,
  2. что вы будете в порядке / захотите использовать div s для хранения сообщений, я лично предпочел бы использовать dl или ol, но, похоже, это немного усложнило демо элементы, хотя их вполне можно использовать.

Если вы хотите получить объяснение (или, по крайней мере, если вы хотите, чтобы мы могли предложить объяснение), вам нужно как минимум опубликовать свой полный jQuery / JavaScript или ссылка на живую демонстрацию, воспроизводящую вашу проблему (либо на вашем собственном сервере, либо по адресу JS Fiddle или аналогичная).

Ссылки:

...