scroll to the bottom of a div

[astralaaron]

I basically have a little chat messenger for my website, but the new messages come up on top and the old ones scroll down which is backwards from what anyone is used to with chat rooms.the messages refresh with ajax into a <span> inside a <div>i am wondering how when the messages update that the div can be scrolled to the bottom so I can make the messages scroll upward like a normal chat room.

[jeffman]

read about scrollHeight and scrollTo(). Scroll your div to various positions manually, including the top and bottom, and examine the value of scrollTop in your DOM Inspector. Compare those values to offsetHeight and scrollHeight. You'll get a feel for it.

[astralaaron]

"examine the value of scrollTop in your DOM instpector" alright I need to find out what this is because I have no clue

[jeffman]

All good browsers have a variation on this thing. I develop in Firefox so that's the one I'm used to. It used to be built in; now (FF3+) you have to go to the FF homepage and add it on. Or just go to your tools menu and click the add ons item. If you don't see DOM Inspector, browse for it. You'll see what I mean. When it's installed, it will be in your tools menu. It brings up a list of ALL your document nodes. Selecting a node (on the left) lets you inspect its styles, javascript values, etc. on the right. So inspect the javascript values of your scrolling div. The list is mostly alphabetical, so the ones you want will be easy to find.EVERYONE should do this kind of thing on a regular basis. You'll understand the structure of your documents so much better.

[astralaaron]

Ok, thank you.