ページを開いたらすぐに指定のページ内リンクにスクロールさせる

2012-08-08    39   49

ページを開いた直後に指定のページ内リンクまでスムーズにスクロールさせるという技。jqueryを使用しています。下記のコードは#sampleの部分まで移動させるという場合のものです。任意で変更してください。

<script>
$(function() {
    var p = $("#sample").offset().top;
    $('html,body').animate({ scrollTop: p }, 'slow');
    return false;
});
</script>
※var p = ~~とありますが、このpはHTMLタグのpとは関係ありません。ただの変数名です。

<2019/7/30 追記>


スムーズスクロールはCSSのみで導入できるようになっていました。
※IEとSafariは非対応
html{
    scroll-behavior: smooth;
}

comment このページの内容についてご意見がございましたらご協力お願いします。

お名前とコメントは入力必須です。

コメントの文字数が短すぎます。

この内容でコメントを送る
コメントをする
この記事がお役に立てましたら是非シェアのご協力お願いします。