Question

in my web page there is a chat window. When the chat’s log is filled out, the user uses scrollbar in order to navigate between messages. I want my chat frame to present always the last message that is located at the bottom. How can I do this using CSS, JavaScript?

Thanks,
Tomer

Answer 1

Even thou is not a tag on your question here is a jQuery solution i use for my chat web app:

//Where chat_message_tray is the scrollable div in your chat
function chat_scroll(chat_messages_tray){
   var scroll_amount = $(chat_messages_tray).attr("scrollHeight") -  $(chat_messages_tray).height();

   $(chat_messages_tray).animate({ scrollTop: scroll_amount}, 500);
}