要素が表示領域に入ったり出たりするとイベントを受け取れる「scrollMonitor」

scrollMonitor

scrollMonitorは、要素が表示領域(ビューポート)に入ったり出たりすることでイベントを受け取ることができるスクリプトです。Watcher Objectsにより、要素を監視してイベントをトリガーします。

scrollMonitor

デモ

デモではナンバリングされた沢山の要素が表示されています。スクロールすると表示領域内で一番上部の列が青色で表示され、一番下部の列が黄色で表示されます。

Watcher Objectsを使用することで、要素の監視とイベントのトリガーを実現しているとのこと。ちなみに、Watcher Objectsには要素の可視性や表示領域に対する相対的な位置などを監視する要素に関する情報も含まれています。

  • DOM Element
  • Object
  • Number
  • jQuery object
  • NodeList(またはArray)
  • string

他にもさまざまなイベントやモジュールなどが用意されています。

また、scrollMonitorはとても高速に設計されているので、大量のデータを表示したい時などにはピッタリですね。コードにはVanilla JSが使われているとのこと。

要素が表示領域に入ったり出たりした時にイベントを受け取れる機能を実装したい人は、ぜひ豊富な機能と高速設計による「scrollMonitor」を使われてみてはいかがでしょうか?

scrollMonitor

スポンサーリンク

スポンサーリンク

アクセスランキング

Tags

Archives