javscript chat div scroll bottom new message code example
Example 1: Chat type scrolling with css
transform rotate(180deg)
Example 2: javascript make chat down scrollable automatically
const messages = document.getElementById('messages');
function appendMessage() {
const message = document.getElementsByClassName('message')[0];
const newMessage = message.cloneNode(true);
messages.appendChild(newMessage);
}
function getMessages() {
// Prior to getting your messages.
shouldScroll = messages.scrollTop + messages.clientHeight === messages.scrollHeight;
appendMessage();
// After getting your messages.
if (!shouldScroll) {
scrollToBottom();
}
}
function scrollToBottom() {
messages.scrollTop = messages.scrollHeight;
}
scrollToBottom();
setInterval(getMessages, 100);