Scroll div contenst to bottom?

MojaveHigh · Oct 7, 2005

How do I scroll the contents of a div or other container down to the bottom?

var div = document.getElementById( "output" );
div.doScroll( 'scrollbarDown' );

That scrolls down one item. I can also scroll down one page, but I seem to get out of sync if the div is filling up with content quickly. Is there a way to always go to the very bottom?

Thanks!

cLFlaVA · Oct 7, 2005

try

Code:

var myDiv = document.getElementById( 'output' );
myDiv.scrollIntoView( false );

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

MojaveHigh · Oct 7, 2005

Hmm, that didn't seem to work. It just keeps it in the current location. It doesn't scroll at all.

cLFlaVA · Oct 7, 2005

hmm

maybe try something like this, not sure if it will be good for your needs but it worked in a quick test for me:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]

<html>
<head>
<title>Untitled</title>
<script type="text/javascript"><!--
function doit() {
    var d = document.getElementById('d');
	var e = document.createElement('a')
	d.appendChild(e);
	e.scrollIntoView(false);
}
//--></script>
</head>

<body>
<button onclick="doit();"></button>
<div id="d" style="height: 100px; overflow: auto;">
text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text 
</div>

</body>
</html>

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

MojaveHigh · Oct 7, 2005

Thanks, I'll try that.

What I'm doing is dynamically adding contents to a div (as in a list) and I always want the last added items to be shown. I read somewhere that it might be necessary to wait a bit of time for the new contents to be added before the scrolling, so I tried setTimeout but that didn't seem to help.

cLFlaVA · Oct 7, 2005

well the code i just gave you adds a blank anchor tag to the bottom, and then scrolls it into view.

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Scroll div contenst to bottom?

MojaveHigh

Programmer

cLFlaVA

Programmer

MojaveHigh

Programmer

cLFlaVA

Programmer

MojaveHigh

Programmer

cLFlaVA

Programmer

Similar threads

Part and Inventory Search

Sponsor