ページ内で簡単にスクロールさせる方法

jQuery 1.2 以降だと scrollTop(と scrollLeft)という疑似スタイルが利用できる

<html>
    <body>
        <p>
            blah, blah, blah, ...
            blah, blah, blah, ...
        </p>

        <p>
            <a href="#" id="link_to_top">ページの先頭へ</a>
        </p>
    </body>
</html>

「ページの先頭へ」というリンクをクリックしたときに,スムーズにスクロールしたい場合

$(function () {
    if (! $.browser.safari) {
        $('#link_to_top').click(function () {
            $(this).blur();

            $('html,body').animate({ scrollTop: 0 }, 'slow');

            return false;
        });
    }
});

トップに移動したときにロケーションバーの URL が # 付きになるのがイヤ & デフォルト動作を回避するために return false;でかえすようにする。

他のアンカーへ飛ぶとき

var targetOffset = $('#hogehoge').offset().top;
$('html,body').animate({scrollTop: targetOffset}, 1000);

ターゲットの絶対位置を offset() 関数で取得して,0 の代わりにそれを scrollTop に指定することで,ターゲットまでスクロールさせることが可能。