smooth scroll - manabuyasuda/jquery-plugins GitHub Wiki

インクルード

<script src="dist/js/smooth-scroll.js"></script>

デフォルト

smoothScroll.init() ;

トップへ戻るボタンの場合は#だけ指定。デフォルトではdata-scroll属性を指定した要素に適応。

<a href="#" data-scroll>トップに戻る</a>

ページ内リンクの場合は通常通り。

<a href="#section1" data-scroll>○○へ移動</a>

<h2 id="section1">○○</h2>

オプション指定

smoothScroll.init({
  selector: '[data-scroll]', // スムーススクロールが有効なリンクに付ける属性
  selectorHeader: '[data-scroll-header]', // 固定ナビに付ける属性
  speed: 500, // 到達するまでの総時間(ミリ秒)
  easing: 'easeInOutCubic', // イージングの種類
  offset: 0, // 到達場所からズラすピクセル数
  updateURL: true, // 実行後のURLの末尾に#をつけるか
  callback: function () {} // コールバック関数 (到達時に実行される関数)
}) ;

イージングの種類はEasing Function 早見表で確認できる。

⚠️ **GitHub.com Fallback** ⚠️