This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The IntersectionObserverEntry
interface of the Intersection Observer API describes the intersection between the target element and its root container at a specific moment of transition. Instances of IntersectionObserverEntry
are delivered to an IntersectionObserver
callback in its entries
parameter; otherwise, these objects can only be obtained by calling IntersectionObserver.takeRecords()
.
IntersectionObserverEntry.boundingClientRect
Read only
DOMRectReadOnly
. The bounds are computed as described in the documentation for Element.getBoundingClientRect()
.IntersectionObserverEntry.intersectionRatio
Read only
intersectionRect
to the boundingClientRect
.IntersectionObserverEntry.intersectionRect
Read only
DOMRectReadOnly
representing the target's visible area.IntersectionObserverEntry.isIntersecting
Read only
true
if the target element intersects with the intersection observer's root. If this is true
, then, the IntersectionObserverEntry
describes a transition into a state of intersection; if it's false
, then you know the transition is from intersecting to not-intersecting.IntersectionObserverEntry.rootBounds
Read only
DOMRectReadOnly
for the intersection observer's root.IntersectionObserverEntry.target
Read only
Element
whose intersection with the root changed.IntersectionObserverEntry.time
Read only
DOMHighResTimeStamp
indicating the time at which the intersection was recorded, relative to the IntersectionObserver
's time origin.This interface has no methods.
Specification | Status | Comment |
---|---|---|
Intersection Observer The definition of 'IntersectionObserverEntry' in that specification. | Working Draft | Initial definition |
Feature | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | 51 | 15 |
53 — 551 55 |
No | ? | ? |
boundingClientRect |
51 | 15 |
53 — 551 55 |
No | ? | ? |
intersectionRatio |
51 | 15 |
53 — 551 55 |
No | ? | ? |
intersectionRect |
51 | 15 |
53 — 551 55 |
No | ? | ? |
isIntersecting |
51 | No |
53 — 551 55 |
No | ? | ? |
rootBounds |
51 | 15 |
53 — 551 55 |
No | ? | ? |
target |
51 | 15 |
53 — 551 55 |
No | ? | ? |
time |
51 | 15 |
53 — 551 55 |
No | ? | ? |
Feature | Android webview | Chrome for Android | Edge mobile | Firefox for Android | IE mobile | Opera Android | iOS Safari |
---|---|---|---|---|---|---|---|
Basic support | 51 | 51 | Yes | ? | No | ? | ? |
boundingClientRect |
51 | 51 | Yes | ? | No | ? | ? |
intersectionRatio |
51 | 51 | Yes | ? | No | ? | ? |
intersectionRect |
51 | 51 | Yes | ? | No | ? | ? |
isIntersecting |
51 | 51 | No | ? | No | ? | ? |
rootBounds |
51 | 51 | Yes | ? | No | ? | ? |
target |
51 | 51 | Yes | ? | No | ? | ? |
time |
51 | 51 | Yes | ? | No | ? | ? |
1. From version 53 until version 55 (exclusive): this feature is behind the dom.IntersectionObserver.enabled
preference (needs to be set to true
). To change preferences in Firefox, visit about:config.
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserverEntry