jQueryで指定した箇所までスクロールする方法

ブログなどに自動的に目次をツールを作ろうとして挫折しました。その際に調べたことをメモしておきます。
HTMLでは見出しの部分にh2やh3などのタグを使います。このタグをめがけてスクロールする方法です。

次のように書くと「2番めのh3タグ」までスクロールします。

obj = $("h3:nth-of-type(2)");
y = obj.offset().top;
$("body").animate({scrollTop:y}, "slow");

“h3:nth-of-type(2)”の部分が「2番めのh3タグ」を表します。
この部分の書き方はCSSのセレクターと同じです。

というタグであれば”#abc”とします。
書き換えれば色々使えます。

コメント

タイトルとURLをコピーしました