For a current web project I am using a div thats defined as overflow:auto; in css and is updated using AJAX. The problem is that after every update the box is still stuck at the same view position. So I was searching for a way to tell it to scroll to top. I archived it with the following steps:
1. Add an anchor to the top of the AJAX content.
<a id="topofpage"> </a>
2. Add this javascript to the bottom of the AJAX Content.
How to jump to an anchor within an AJAX Area
For a current web project I am using a div thats defined as overflow:auto; in css and is updated using AJAX. The problem is that after every update the box is still stuck at the same view position. So I was searching for a way to tell it to scroll to top. I archived it with the following steps:
1. Add an anchor to the top of the AJAX content.
2. Add this javascript to the bottom of the AJAX Content.
<script type="text/javascript"> //<![CDATA[ $('topofpage').scrollIntoView(); //]]> </script>Voila! Now after every reload the AJAX area should jump back to the top. Mozilla has some more information and examples on the scrollIntoView Method. This solution has been tested with FF3 IE7 and Safari4. It also requires Prototype to work.