IntersectionObserverEntry.target
Experimental: Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.
La propriété en lecture seule target de l'interface IntersectionObserverEntry indique quel Element ciblé a changé sa proportion d'intersection avec l'élément racine.
Syntaxe
var target = IntersectionObserverEntry.target;
Valeur
La propriété target de l'IntersectionObserverEntry spécifie quel Element précédemment ciblé par l'appel à IntersectionObserver.observe() dont l'intersection avec la racine a changé.
Exemple
Dans cet exemple, la valeur de la propriété CSS opacity de chaque élément cible vaut son intersectionRatio (en-US).
function intersectionCallback(entries) {
entries.forEach(function(entry) {
entry.target.opacity = entry.intersectionRatio;
});
}
Ainsi, l'élément devient visible seulement lorsqu'il est entièrement visible, c'est-à-dire que la zone qu'il couvre est contenue dans celle de la racine. Autrement, son opacité diminue graduellement avec sa proportion d'intersection avec son élément racine.
Pour voir un exemple plus concret, vous pouvez vous renseigner sur l'Handling intersection changes in Timing element visibility with the Intersection Observer API.
Spécifications
| Specification |
|---|
| Intersection Observer # dom-intersectionobserverentry-target |
Compatibilité des navigateurs
BCD tables only load in the browser