Prevent browser from snapping to previous scroll position on back button
<p>In my <code>AJAX</code> application, there is a main page with folders that contain images. When the user clicks a folder it hides the folders and then repopulates the same div with images from that folder. This is all done using hashtags.</p>

<p>Everything works great until they click the back button.</p>

<p>When the user clicks the back button, this happens (in sequence, every time):</p>

<ol>
<li>the very first thing that happens is the browser snaps down to where it just was when last visiting that hash</li>
<li>my <code>hashchange</code> event is called which removes the thumbnails</li>
<li>now that there is not enough of a content height after the thumbnails have been removed, the window has to snap back up to a scrollTop of 0 as there is, for a split second, no scrollbar</li>
<li><em>then</em> the folders are shown again</li>
<li><em>then</em> my script kicks in to restore the user to where they were on the page</li>
</ol>

<p>The problem: This creates really bad <code>flickering</code> because of how much the scrollbar is being snapped around.</p>

<p>The solution: Making the browser not try to restore its scroll position when the hash changes.</p>

<p>How do I know this will work? When I set up a button/link on my site to do the above, the flickering does not occur because the browser does not automatically try to scroll down. Why can't putting my own back button on the site be the solution? People really like their browser back button and the flickering is <em>really</em> annoying.</p>

<p>I included some code below, but I don't think it is really necessary to look at:</p>

<pre><code>// called when a folder is clicked
function hide_main() {
    window.scroll_top = $(window).scrollTop();

    $('#favorite_container').hide();
    $('#top_div &gt; h2.favorite_main').hide();
}

// called when the user wants to go back to the main page that lists all the folders
function show_main() {
    $$.vars.lock = true;

    $('#top_div &gt; h2.favorite_other').remove();
    $('#thumbs').empty();

    $('#top_div &gt; h2.favorite_main').show();
    $('#favorite_container').show();

    $('html, body').scrollTop(window.scroll_top);
}
</code></pre>

<p>So how do I go about stopping the browser from doing its default behaviour of scrolling to the position it previously was when the back button is pressed?</p>
