auto scroll to bottom when overflow auto

Question

does anyone know how to automatically jump to the bottom of a scrollable area by event in jquery ( or even javascript if no easy jquery solution)?

regards

Answer 1

<div id="myDiv" style="height:300px;overflow:auto;">
    <p>my content here</p>
</div>

var myDiv = $("#myDiv");
myDiv.animate({ scrollTop: myDiv.attr("scrollHeight") - myDiv.height() }, 3000);

Edit:

jQuery 1.6 introduced .prop and changed the meaning of .attr thus $("#someDiv").attr("scrollHeight") won't work anymore.

Need to be changed to: $("#someDiv").prop("scrollHeight")

Reference.

Answer 2

myDiv.attr("scrollHeight")

won't work in recent jQuery versions. You will need to resort to:

myDiv[0].scrollHeight

Answer 3

mm.prop("scrollHeight") does the trick (for jQuery 1.6 and forward).