HC Sticky

JavaScript

スクロールしても要素を固定できるJSライブラリ「HC Sticky」

HC Stickyはスクロールした時に特定の要素を固定したまま表示できるJavaScriptライブラリです。スクロールとともに見えなくならないような機能を実装したい人に最適です。オプションも豊富でカスタマイズ性にも優れています。

HC Sticky

デモ

  • Default – bigger than window
  • Default – smaller than window
  • Multiple Stickies
  • Inner Sticker
  • Inner Sticker not following scroll
  • Inner Top not following scroll
  • Browserify test
  • jQuery test

どれも下へスクロールしていくと、特定の要素が固定されたまま表示されるのを確認できるかと思います。常にユーザーの目に触れさせておきたい情報などがある場合にはとても有効な機能になりますね。

オプションには、top、bottom、innerTop、innerSticker、bottomEnd、stickTo、followScroll、stickyClass、responsive、mobileFirst、onStart、onStop、onBeforeResize、onResize、resizeDebounceといった項目が用意されています。

HC Sticky

関連記事

  1. JavaScript

    2KB程の軽量&シンプルなjQueryスライダー「Craftyslide」を使ってみた

    とてもシンプルで軽量ないい感じのjQueryプラグイン「Craftys…

  2. JavaScript

    シンプルな構成で簡単に実装することができるツールチップ「jQuery PowerTip」

    とてもシンプルな構成で簡単に実装することができるjQueryプラグイン…

  3. no-image

    JavaScript

    スマホなどに最適なテーブルを実装できる「Mobile-Friendly Table」

    Mobile-Friendly Tableはスマホなどのモバイルに最適…

  4. topbar

    JavaScript

    画面上部に美しいプログレスバーを表示できる「topbar」

    topbarは、ページ読み込み時に画面上部に美しいプログレスバーを表示…

  5. Popper.js

    JavaScript

    軽量で見やすいツールチップを実装できる「Popper.js」

    Popper.jsはユーザーにとって見やすいツールチップを実装できるJ…

  6. SmartPhoto.js

    JavaScript

    レスポンシブなイメージビューアを実装できる「SmartPhoto.js」

    SmartPhoto.jsは、レスポンシブに対応したかっこいいイメージ…

最近の記事

  1. タリーズ ハウスブレンド
  2. BAG-TW1BKシリーズ
  3. 落ち葉と雪

アーカイブ

PAGE TOP