View Full Version : Scroll down a div

06-19-2007, 02:48 PM
Hello. i'm making a chat for my homepage and i am making it ajaxed so i need to know how to scroll down a div. i found an CSS atribute overflow: auto; but i don't know how to make it scroll down. when i was making non-ajax chat i used iframe and then it wasn't a problem but now with div i have no idea how to do it.:confused:

06-19-2007, 02:55 PM


06-19-2007, 02:59 PM
no i didn't wanted it to scroll down all the time. i just wanted it to scroll down on page load till bottom and that's all

06-19-2007, 03:16 PM
Than grab out the code that scrolls it to the bottom. You can do it!


06-19-2007, 03:27 PM
hmm it can't even seem to work without me in action. did i do something wrong?

<script type="text/javascript">

var chatscroll = new Object();

chatscroll.Pane = function(scrollContainerId){
this.bottomThreshold = 20;
this.scrollContainerId = scrollContainerId;
this._lastScrollPosition = 100000000;

chatscroll.Pane.prototype.activeScroll = function(){

var _ref = this;
var scrollDiv = document.getElementById(this.scrollContainerId);
var currentHeight = 0;

var _getElementHeight = function(){
var intHt = 0;
if(scrollDiv.style.pixelHeight)intHt = scrollDiv.style.pixelHeight;
else intHt = scrollDiv.offsetHeight;
return parseInt(intHt);

var _hasUserScrolled = function(){
if(_ref._lastScrollPosition == scrollDiv.scrollTop || _ref._lastScrollPosition == null){
return false;
return true;

var _scrollIfInZone = function(){
if( !_hasUserScrolled ||
(currentHeight - scrollDiv.scrollTop - _getElementHeight() <= _ref.bottomThreshold)){
scrollDiv.scrollTop = currentHeight;
_ref._isUserActive = false;

if (scrollDiv.scrollHeight > 0)currentHeight = scrollDiv.scrollHeight;
else if(scrollDiv.offsetHeight > 0)currentHeight = scrollDiv.offsetHeight;


_ref = null;
scrollDiv = null;

var divScroll = new chatscroll.Pane('scroll');
<div onclick="divScroll.activeScroll();" id="scroll" style="overflow: auto; background : #000000; color : #ffffff; padding : 4px; width : 200px; height : 50px; ">
1<br />
2<br />
3<br />
4<br />
5<br />
6<br />
7<br />
8<br />
9<br />
10<br />

if it's something wrong there tell me

EDIT: ok i looked down and i saw a code to scroll down and i midified it ad voila :D:

function scrooldown(div)
var scrollDiv = document.getElementById(div);
scrollDiv.scrollTop = scrollDiv.scrollHeight;
scrollDiv = null;

piet bierbuik
06-29-2007, 01:45 PM
Can you send me the full code. i don't get it to work.
but im still a noob :D