【jQuery】シングルページに使えそう。Gumshoe

gumshoe

Gumshoeはシンプルなscrollspyスクリプト。ヘッダーを固定し、スクロールに合わせてナビゲーションに動きを持たせ、現在の位置を確認できるようになります。ナビゲーションのリンクにはSmooth Scrollが使用されています。

Gumshoeインストール

JS

<script src="dist/js/classList.js"></script>
<script src="dist/js/gumshoe.js"></script>

HTML マークアップ

<nav data-gumshoe-header>
<ul data-gumshoe>
<li class="active"><a class="active" href="#eenie">Eenie</a></li>
<li><a href="#meanie">Meanie</a></li>
<li><a href="#minnie">Minnie</a></li>
<li><a href="#moe">Moe</a></li>
</ul>
</nav>

初期設定

<script>
gumshoe.init();
</script>
 

【jQuery】シングルページに使えそう。Gumshoe

  • LATEST
  • RELATED
  • POPULAR