スクロールでヘッダーを出し入れするHeadroom.js

ページをスクロールすると、ヘッダーを縮んだり開いたりできるJSをご紹介します。

デモ

ヘッダー

$("header").headroom({
  "tolerance": 5,
  "offset": 205,
  "classes": {
    "initial": "animated",
    "pinned": "slideDown",
    "unpinned": "slideUp",
    "top": "headroom--top",
    "notTop": "headroom--not-top"
  }
});