Intersection Observerでターゲットの監視の止め方

目次

ターゲットの監視を止めるために、アンオブザーブメソッドを使っていきます。

  • callbackの第2引数
  • アンオブザーブメソッド

ターゲットの止め方

前回まででターゲットの監視をエリアの指定について見てきました。

詳しくは『Intersection Observerの余白の考え方』の記事を御覧ください。

今回はターゲットの監視を止める方法について見ていきます。

例えば、一回表示した画像はもうそのままふわっとさせず表示したままにしたい場合はターゲットの監視を止めればいいのです。

そうしておくことによってブラウザの負荷も抑えることができます。

なので、最初は画像をふわっと表示させたあとに監視を止めていきましょう。

callbackの第2引数

まずcallbackの第二引数にこの関数を実行しているobserverを渡すことができます。

なので、第二引数にobsを定数として指定します。

アンオブザーブメソッド

次に監視を止めるためのメソッドとしてunobserveがあるのでunobserveを渡していきましょう。

obs.unobserve(entries[0].target);と書いていけばいいでしょう。

TeatreeWEB

この記事が気に入ったら
いいね または フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
目次