IntersectionObserverEntry: isIntersecting-Eigenschaft

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2019.

Die schnittstellenübergreifende, schreibgeschützte isIntersecting-Eigenschaft der IntersectionObserverEntry gibt einen booleschen Wert zurück, der true ist, wenn das Ziel-Element mit dem Wurzel-Element des Intersection Observers schneidet. Ist dieser Wert true, beschreibt der IntersectionObserverEntry einen Übergang in einen Zustand der Überschneidung; ist er false, wissen Sie, dass der Übergang von überschneidend zu nicht-überschneidend erfolgt.

Wert

Ein boolescher Wert, der angibt, ob das target-Element in einen Zustand der Überschneidung (true) eingetreten ist oder aus einem Zustand der Überschneidung (false) herausgegangen ist.

Beispiele

In diesem einfachen Beispiel wird ein Überschneidungs-Callback verwendet, um einen Zähler zu aktualisieren, der anzeigt, wie viele Ziel-Elemente derzeit mit der Schnittwurzel im Überschneidungsbereich liegen.

js
function intersectionCallback(entries) {
  entries.forEach((entry) => {
    if (entry.isIntersecting) {
      intersectingCount += 1;
    } else {
      intersectingCount -= 1;
    }
  });
}

Um ein konkretes Beispiel zu sehen, werfen Sie einen Blick auf Behandlung von Überschneidungsänderungen.

Spezifikationen

Specification
Intersection Observer
# dom-intersectionobserverentry-isintersecting

Browser-Kompatibilität

BCD tables only load in the browser