【jQuery】スムーススクロールを実装する(WordPress用)

仕事

コード紹介

こちらも毎回実装するけど、自分で書くのが面倒で毎回調べているので、メモ用として記載。


jQuery(function(){
  jQuery('a[href^="#"]').click(function(){
    let speed = 500;//ここでスクロールスピードを調整します。
    let href= jQuery(this).attr("href");
    let target = jQuery(href == "#" || href == "" ? 'html' : href);
    let position = target.offset().top;//ここで移動する位置を決定しているのでヘッダー分ずらしたいなどがあればここを調整
    jQuery("html, body").animate({scrollTop:position}, speed, "swing");
    return false;
  });
});

$をjQueryとしてますが、WP用なので、もちろんjQueryを$にしても使えます。
WP以外でもjQueryのまま使えるようです。

コメント

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