Example: Animating scroll with jQuery
A reader asked for an example of using the jQuery scroll code I had written a while back. Based on that code, here is the example:
<div id="myDiv" style="width: 500px; height: 100px; overflow: auto; border: 1px solid black;"></div>
<form>
<input type="text" id="myTextInput" />
<input type="button" value="Send" id="postButton" />
</form>
<script type="text/javascript">
$(document).ready(function(){
$('#postButton').click(function(){
$('#myDiv').append($('#myTextInput').val() + '<br/>');
$('#myTextInput').val('');
$("#myDiv").animate({ scrollTop: $("#myDiv").attr("scrollHeight") }, 1000);
});
});
</script>
A simple, functional example.
Check out the demo: http://demos.kisdigital.com/index.cfm/demos/scroll
Edit 3/10/10:
Please see the new post here:
http://kisdigital.wordpress.com/2010/03/10/using-jquery-to-scroll-to-the-bottom-of-a-div-revised/
Categories: jQuery
Recent Comments