IntersectionObserverEntry: свойство intersectionRect

Только для чтения свойство IntersectionObserverEntry интерфейса intersectionRect — это объект DOMRectReadOnly, который описывает наименьший прямоугольник, содержащий всю видимую часть целевого элемента внутри области пересечения корневого элемента.

Объект DOMRectReadOnly, описывающий часть целевого элемента, которая в данный момент видна внутри прямоугольника пересечения корневого элемента.

Этот прямоугольник вычисляется путём пересечения прямоугольника boundingClientRect с каждым из прямоугольников обрезки предков target, за исключением самого прямоугольника пересечения root.

В этом простом примере обратный вызов Intersection наблюдает за прямоугольником пересечения для последующего использования кодом, который рисует содержимое целевых элементов, чтобы перерисовывался только видимый участок.

function intersectionCallback(entries) {
  entries.forEach((entry) => {
    refreshZones.push({
      element: entry.target,
      rect: entry.intersectionRect,
    });
  });
}