Forum Moderators: open

Message Too Old, No Replies

div scrolling

auto scoll a div to the bottom on page load?

         

davelms

12:58 pm on Apr 30, 2005 (gmt 0)

10+ Year Member



Inside of a page I have a div that has "overflow:auto" and a "height" set. Therefore, when the content of the div exceeds the height I get a scrollbar. Good so far.

Now by default the scrollbar scrolls from top to bottom of the content of the div.

However, my most recent content is at the bottom (this is where I would like it to stay, I know I could reverse the order).

So my question is: is there a way, on page load (rather than a user event), that I can use javascript* to make the div automatically scroll so that when the user views the content they are positioned such that the scrollbar is at the bottom (and hence related fresh content) and not at the top.

* doesn't have to be javascript!

I believe I can iframe the div's content, and use window.scrollTo or something along those lines - but I wish to avoid that if at all possible.

adni18

2:11 pm on Apr 30, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Try this:

<BODY onLoad="document.getElementById('news').scrollTop=document.getElementById('news').scrollHeight-document.getElementById('news').clientHeight">
<div style="overflow:auto;width:200px;height:300px;border:1px solid black;font-size:10px;font-family:arial" id="news">Event 1<br><br><BLOCKQUOTE>Blah blah blah</BLOCKQUOTE><br><br>Event 2<br><br><BLOCKQUOTE>Blah blah blah</BLOCKQUOTE><br><br>Event 3<br><br><BLOCKQUOTE>Blah blah blah</BLOCKQUOTE><br><br>Event 4<br><br><BLOCKQUOTE>Blah blah blah</BLOCKQUOTE><br><br>Event 5<br><br><BLOCKQUOTE>Blah blah blah</BLOCKQUOTE><br><br>Event 6<br><br><BLOCKQUOTE>Blah blah blah</BLOCKQUOTE><br><br>Event 7<br><br><BLOCKQUOTE>Blah blah blah</BLOCKQUOTE><br><br></DIV>

davelms

3:53 pm on Apr 30, 2005 (gmt 0)

10+ Year Member



ace. ta :)