how can I make a html scrollbar start at the bottom?

Question

I'm trying to make a scrollable area for a chatbox, but my scrollbar starts at the top and not the bottom. This means you see all the first messages, but not all the new ones until you scroll down. This chatbox is going to get a lot of messages, so the bar needs to start at the bottom.

This is what I got so far in JQuery, but it's not working

$('#chatbox').each(function(){
                $(this).scrollTop($(this).prop('scrollHeight'));
            });

So how do I get a scrollbar to stay at the bottom of the scroll?

Edit: Now using this code. it goes to around the middle, but not the bottom.

$('#chatbox').animate({ 
                   scrollTop: $('#chatbox').height()}, 0
                );

HIya, is this what you are looking for - http://stackoverflow.com/questions/1890995/jquery-scroll-to-bottom-of-page-iframe ; hope it helps, cheers — Tats_innit, Mar 11 '12 at 22:30
Well, it helped some, I got the scrollbar to load to around the middle, but not the bottom. I'll post what I've updated — CyanPrime, Mar 11 '12 at 22:40
Well, heres the site with all the js code: (Theres not much js code) http://exvs.us/ — CyanPrime, Mar 11 '12 at 22:48

score 6 · Answer 1 · answered Mar 11 '12 at 22:49

Okay I figured it out. This is the code that got it working:

$('#chatbox').animate({ 
                   scrollTop: $("#chatbox").prop("scrollHeight")}, 0
                );

Or for non-animated:

            $("#chatbox").prop({ scrollTop: $("#chatbox").prop("scrollHeight") });

how can I make a html scrollbar start at the bottom?

1 Answers1

Linked