jquery-scrollstop

JavaScript

スクロールの開始・終了時のイベントを設定できる「jquery-scrollstop」

jquery-scrollstopはスクロールの開始・終了時のイベントを設定することができるjQueryプラグインです。スクロール中に実行したいもの、またはスクロールされていない時に実行したいものを自由にセッティングできるのがいいですね。

jquery-scrollstop

デモ

デモではスクロールがスタートされ(スクロール中)るとテキストカラーが変更される他、画面上部に「SCROLLING PAGE」という文字が固定表示されます。

そしてスクロールをストップするとテキストカラーが変更され、「SCROLLING PAGE」という文字は非表示になります。

使い方はこんな感じでスクロール開始時と終了時に実行したい動作を設定してあげます。

$(window)
    .on("scrollstart", function() {
        $(document.body).css({background: "yellow"});
    })
    .on("scrollstop", function() {
        $(document.body).css({background: "green"});
    })

応用次第で様々な動作を加えることができそうですね。

というわけで、スクロールの開始・終了イベントを設定できる「jquery-scrollstop」のご紹介でした。

jquery-scrollstop

関連記事

  1. jQuery Bar Rating

    JavaScript

    選択範囲を評価ウィジェットに変換できる「jQuery Bar Rating」

    jQuery Bar Ratingは、ユーザーが選択する範囲を評価ウィ…

  2. FModal.JS

    JavaScript

    シンプルなフルスクリーンのモーダルウィンドウ「FModal.JS」

    FModal.JSはシンプルなフルスクリーンのモーダルウィンドウを実装…

  3. multi-list

    JavaScript

    複数の選択可能なリストにするためのjQueryプラグイン「multi-list」

    multi-listは、順序付けされていないリストを複数の選択可能なリ…

  4. no-image

    JavaScript

    要素ごとにスクロールできるjQueryプラグイン「snapScroll.js」

    snapScroll.jsは要素ごとにきりのいいところでスクロールされ…

  5. PreViewTube.js
  6. jQuery cForm

    JavaScript

    フォームのスタイルをカスタマイズできる「jQuery cForm」

    jQuery cFormはフォームのスタイルを簡単にカスタマイズするこ…

最近の記事

  1. OWL-WDDESK01
  2. ワンタッチ着脱フィルターキット
  3. Soundcore Ace A1
  4. cheero USB-C PD Charger 60W

アーカイブ

PAGE TOP