javascript прокрутите вниз до класса div

Question

Привет Я пытаюсь реализовать простой чат-бокс в django и задавался вопросом, как прокручивать нижнюю часть div-класса с помощью javascript? В основном, когда загружается страница, мне бы хотелось, чтобы пользователи могли видеть последнее сообщение, отправленное им, а не последнее.

Answer 1

Я должен был сделать это недавно для подобной вещи. Я нашел базовый плагин jquery, который будет плавно прокручивать элемент на экране.

(function($) { 

    $.fn.scrollMinimal = function() { 

    var cTop = this.offset().top; 
    var cHeight = this.outerHeight(true); 
    var windowTop = $(window).scrollTop(); 
    var visibleHeight = $(window).height(); 

    if (cTop < windowTop) { 
     $('body').animate({'scrollTop': cTop}, 'slow', 'swing'); 
    } else if (cTop + cHeight > windowTop + visibleHeight) { 
     $(jQuery.browser.webkit ? "body": "html") 
     .animate({'scrollTop': cTop - visibleHeight + cHeight}, 'slow', 'swing'); 
    } 
    }; 

}(jQuery)); 

, который используется, как это:

$('#chat').scrollMinimal(); 

Answer 2

Ну, базовый сценарий, установлен scrollTop равен scrollHeight, так что вам нужен сценарий, как это:

var DIV = document.getElementById('theDIVElement'); 
DIV.scrollTop = DIV.scrollHeight; 

Вы только необходимо изменить theDIVElement на ваш идентификатор DIV.

Answer 3

Это сценарий, который я использовал в моем чате:

<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
function myScroll() { 
    window.scrollBy(0,01) 
    setTimeout('myScroll()',100); } 
if (document.layers || document.all) 
    myScroll() 
//--></SCRIPT> 

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