Javascript smooth scroll on page load?

Question

PHP example: http://davidwalsh.name/dw-content/onload-smooth-scroll.php?scrollto=c4

Scrolling to a #link within the current page is easy, but I'm trying to load a new page then scroll it down after it has loaded.

Here's how my links are set up:

<a href="page1.php#top">Page 1</a>
<a href="page2.php#top">Page 2</a>
<a href="page3.php#top">Page 3</a>

Here's the div I want it to scroll to:

<div id="top"></div>

The problem is the php links. I can't find a script with examples in that format...

Answer 1

The link you provided suggests thats the urls should have the id of the element as a parameter named 'scrollto' . Try using something like

<a href="page1.php?scrollto=top">Page 1</a>

Answer 2

Problem solved:

Put this in the head:

<script src="jquery.scrollTo-min.js"></script>

<script language="javascript" type="text/javascript">

$(document).ready(function(){

    $.scrollTo( '#top', 1000 );

});

</script>

scrollTo plugin is here (http://flesler.blogspot.com/2007/10/jqueryscrollto.html)

And my links will no longer have hash tags:

<a href="page1.php">Page 1</a>

Answer 3

function scrollWin(id){
    $('html, body').animate({
        scrollTop: $(id).offset().top
    }, 2000);
}

$(document).ready(function(){
    id = window.location.href.replace(/([^#]+)#/,'');
    scrollWin(id);
});

http://blog.freelancer-id.com/index.php/2009/03/26/scroll-window-smoothly-in-jquery