使うと「お、この要素見える位置に入ってきたな」と分かったときに好きな処理を行えます。これを使うにはまずインスタンスを作ります。*/});ここで渡したcallbackは(デフォルトで)ブラウザ画面に要素が入ってきたり、出ていったとこに発火されるコールバック関数です。この関数は引数にIntersectionObserverEntryの配列を渡してきます。この値は出たり入ったりした要素と様々なコンテキストを持ったオブジェクトです。intersectionRatioはコンテキストの1つで、0-1の間(小数点含む)の値で対象の要素は今どれだけ可視領域に入ってるのかが分かります。これは0だとすべて見えてない、1だとすべて見えてるという意味になるからです。先程デフォルトでと書きましたが、どの要素を基準に出たり入ったりを監視するかは変えることができます。これにはIntersectionObserverの第2引数を使います。第2引数には基準を変える以外の要素も持っています。rootrootが要素の基準になるものです。document.getElementById('container')}とすると、そのobserverで監視した要素は#containerから出たり入ったりした時にコールバックが走るようになります。rootMarginrootMarginはroot要素の領域を拡大・縮小化できます。50px'とした場合、要素の見た目は変わりませんが、上右下左側に50px余分に自分の可視領域だと見なすことができます。observeしている要素が表示領域まで達するのに実際はあと50pxあったとしてもコールバック関数が発火します。この値を例えば-50pxとすると逆の意味になります。-50pxと設定されていると実際に見えるようになった領域から更に50pxスクロールしなければコールバックが発火しなくなります。0pxが設定されてます。thresholdthresholdはどれくらいの頻度でコールバックを呼び出すかを設定します。デフォルトでは0が設定されてます。これは(rootMarginがすべて0の状態で)1pxでも被った時コールバック関数を実行するということになります。この値を0.5に変えると要素が半分見えた時にコールバック関数が発火するようになり、1だとすべて見えた時...という具合になります。半分見えなくなった時まったく見えなくなった時という具合でコールバック関数が呼ばれるようになります。監視を始めるにはIntersectionObserver#observeを呼びます。この引数には監視対象となる要素を渡します。observer.observe(element);監視の必要が無ければ解除しましょう。それにはIntersectionObserver#unobserveまたはIntersectionObserver#disconnectを使います。前者は要素1つに関して監視を解除するメソッドですが、後者はそのオブザーバーの監視対象すべてについて解除します。observer.observe(element);observer.disconnect();。