Панель прокрутки чата

Question

Я работаю над своим окном чата, когда новые посты добавляются внизу, как я могу сделать так, чтобы полоса прокрутки следовала за новыми данными внизу по мере их добавления или оставалась там, где вы есть, если, скажем, перечитываете в середине что-то вроде того, что делают большинство клиентов IRC?

Answer 1

Сделайте прокрутку до высоты прокрутки:

var el = document.getElementById("theDiv");
el.scrollTop = el.scrollHeight;

Answer 2

Когда новое сообщение получено, сначала проверьте, равна ли текущая позиция прокрутки scrollHeight (или, возможно, в пределах небольшого процента от scrollHeight, для случаев, когда пользователь не прокрутил до конца, но это незаметно).

Если это так, просто добавьте сообщение и установите scrollTop = scrollHeight;

Если нет, то оставьте его в покое.

Answer 3

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

element.scrollTop = 100000;