I wrote this little code segment to illustrate the idea of what I want. I'd like to be able to automatically scroll the DIV to the bottom when you add stuff to it.
<html>
<head>
<title>Auto Scrolling Div</title>
<head>
<script type="text/javascript">
<!--
function addStuff() {
var stuff = document.getElementById('foo').value;
oldStuff = document.getElementById('bar').innerHTML;
newStuff = oldStuff + ' ' + stuff;
document.getElementById('bar').innerHTML = newStuff;
}
-->
</script>
</head>
<body>
<div id="bar" style="overflow: auto; height: 150px; width: 100px;">
Stuff Stuff Stuff Stuff Stuff Stuff Stuff Stuff Stuff
Stuff Stuff Stuff Stuff Stuff Stuff Stuff Stuff Stuff
Stuff Stuff Stuff Stuff Stuff Stuff Stuff Stuff Stuff
</div>
<input type="text" id="foo">
<input type="submit" value="Add Stuff" onclick="addStuff()">
</body>
</html>
So, you type something in and click Add Stuff. It will scroll to the bottom so you can see what you just added. That would be awesome.
Thanks in advance