Baseline Widely available *
Das IntersectionObserver-Interface der Intersection Observer API bietet eine Möglichkeit, Ãnderungen in der Ãberschneidung eines Ziel-Elements mit einem übergeordneten Element oder mit einem Dokument auf oberster Ebene zu beobachten. Das übergeordnete Element oder der Viewport wird als Wurzel bezeichnet.
Wenn ein IntersectionObserver erstellt wird, wird er so konfiguriert, dass er auf bestimmte Sichtbarkeitsverhältnisse innerhalb der Wurzel achtet. Die Konfiguration kann nicht geändert werden, nachdem der IntersectionObserver erstellt wurde, sodass ein konkretes Beobachterobjekt nur nützlich ist, um spezifische Ãnderungen im Sichtbarkeitsgrad zu beobachten; Sie können jedoch mehrere Ziel-Elemente mit demselben Beobachter beobachten.
IntersectionObserver()
Erstellt ein neues IntersectionObserver-Objekt, das eine angegebene Callback-Funktion ausführt, wenn es erkennt, dass die Sichtbarkeit eines Ziel-Elements einen oder mehrere Schwellenwerte überschritten hat.
IntersectionObserver.delay Schreibgeschützt Experimentell
Eine ganze Zahl, die die minimale Verzögerung zwischen Benachrichtigungen dieses Beobachters angibt.
IntersectionObserver.root Schreibgeschützt
Das Element oder Document, dessen Begrenzungen als Begrenzungsrahmen bei der Ãberprüfung von Ãberschneidungen verwendet werden. Wenn dem Konstruktor kein root-Wert übergeben wurde oder sein Wert null ist, wird der Viewport des Dokuments auf oberster Ebene verwendet.
IntersectionObserver.rootMargin Schreibgeschützt
Ein Versatzrechteck, das auf den Begrenzungsrahmen der Wurzel angewendet wird, wenn Ãberschneidungen berechnet werden, um ihn effektiv zu verkleinern oder zu vergröÃern. Der von dieser Eigenschaft zurückgegebene Wert kann von dem bei der Konstruktoraufruf angegebenen Wert abweichen, da er an interne Anforderungen angepasst werden kann. Jeder Versatz kann in Pixeln (px) oder Prozent (%) angegeben werden. Der Standardwert ist "0px 0px 0px 0px".
IntersectionObserver.scrollMargin Schreibgeschützt
Ein Versatzrechteck, das auf jeden Scrollcontainer auf dem Pfad von der Ãberschneidungswurzel zum Ziel angewendet wird, um die bei der Berechnung von Ãberschneidungen verwendeten Clipping-Rechtecke effektiv zu verkleinern oder zu vergröÃern. Der von dieser Eigenschaft zurückgegebene Wert kann von dem bei der Konstruktoraufruf angegebenen Wert abweichen.
IntersectionObserver.thresholds Schreibgeschützt
Eine Liste von Schwellenwerten, sortiert in aufsteigender numerischer Reihenfolge, wobei jeder Schwellenwert das Verhältnis der Ãberschneidungsfläche zur Begrenzungsrahmenfläche eines beobachteten Ziels darstellt. Benachrichtigungen für ein Ziel werden generiert, wenn einer dieser Schwellenwerte für dieses Ziel überschritten wird. Wenn dem Konstruktor kein Wert übergeben wurde, wird 0 verwendet.
IntersectionObserver.trackVisibility Schreibgeschützt Experimentell
Ein boolescher Wert, der angibt, ob dieser IntersectionObserver überprüft, dass das Ziel keine beeinträchtigte Sichtbarkeit hat.
IntersectionObserver.disconnect()
Stoppt das IntersectionObserver-Objekt darin, irgendein Ziel zu beobachten.
IntersectionObserver.observe()
Gibt dem IntersectionObserver ein Ziel-Element an, das beobachtet werden soll.
IntersectionObserver.takeRecords()
Gibt ein Array von IntersectionObserverEntry-Objekten für alle beobachteten Ziele zurück.
IntersectionObserver.unobserve()
Gibt dem IntersectionObserver an, die Beobachtung eines bestimmten Ziel-Elements zu stoppen.
const intersectionObserver = new IntersectionObserver((entries) => {
// If intersectionRatio is 0, the target is out of view
// and we do not need to do anything.
if (entries[0].intersectionRatio <= 0) return;
loadItems(10);
console.log("Loaded new items");
});
// start observing
intersectionObserver.observe(document.querySelector(".scrollerFooter"));
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4