Question

Duplicate

Scrolling Overflowed DIVs with JavaScript

---

I have an AJAX chat that outputs the messages to a div with overflow: auto so if it gets too long, the scroll bar comes up. Is there is a way to have it auto scroll to the bottom whenever a new message is added? Preferably using jQuery?

Answer 1

it’d be done with the following line

$('#youChatDiv').attr({ scrollTop: $('#youChatDiv').attr('scrollHeight') }); 

what this does is set the scroll to the height of the own element

just call that with every new message 🙂

cheers