You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
IntersectionObserver allows us to detect whether an element is within the viewport, but that still doesn't guarantee that it is actually visible. It's possible that the element might have some other element overlayed over it, via CSS position: absolute, fixed etc, rendering it not visible or only partially visible to the user. If the overlaying element is from a different domain than the target element, there's currently no way to detect it from within the scope of the target element.
In advertising jargon this is called "ad stacking", where an ad or other element is placed over the top of another ad so as to get paid for an ad impression that was never seen by the user.
My suggestion for how to add detection for this scenario without giving away too much cross-domain info is to add another property to the IntersectionObserverEntry called visiblePixels: [number]. It should be a count of the total number of pixels belonging to the target element that are visible, i.e. are within the viewport AND have no overlaying element blocking them from view. So if the element is completely visible the visiblePixels would be equal to [intersectionRect.width * intersectionRect.height].
As an example, say the target element is 100x100px, is fully within the viewport, but there is a 100x50px element overlayed on top of it, the visiblePixels would be [(100 * 100) - (100 * 50) = 5000]
Alternatively, we could put a list of overlaying rectangles inside each IntersectionObserverEntry as an array of IntersectionObserverEntry's, then let js client calculate how much of his target element is overlayed. But this gives us a bunch of extra cross-domain information that we (in advertising-land) really don't care about: the number and shape of overlaying elements, and also pushes more calculation onto the js side, when we really only want to know how much of our target element is visible.
The text was updated successfully, but these errors were encountered:
This is a known issue, but beyond the scope of the initial IntersectionObserver spec. We will hopefully revisit this for a subsequent iteration of the spec.
A couple of considerations:
The current IntersectionObserver spec does not reveal any more information than can currently be acquired by other means. Adding overlay detection would reveal more information than is currently available, and as such, we need to carefully consider security and privacy issues.
The current IntersectionObserver spec can be implemented in a straightforward way in existing browsers, but it's not clear that this is true for overlay detection. We should be careful not to write a spec that can't or won't be implemented by major browsers.
IntersectionObserver allows us to detect whether an element is within the viewport, but that still doesn't guarantee that it is actually visible. It's possible that the element might have some other element overlayed over it, via CSS position: absolute, fixed etc, rendering it not visible or only partially visible to the user. If the overlaying element is from a different domain than the target element, there's currently no way to detect it from within the scope of the target element.
In advertising jargon this is called "ad stacking", where an ad or other element is placed over the top of another ad so as to get paid for an ad impression that was never seen by the user.
My suggestion for how to add detection for this scenario without giving away too much cross-domain info is to add another property to the IntersectionObserverEntry called visiblePixels: [number]. It should be a count of the total number of pixels belonging to the target element that are visible, i.e. are within the viewport AND have no overlaying element blocking them from view. So if the element is completely visible the visiblePixels would be equal to [intersectionRect.width * intersectionRect.height].
As an example, say the target element is 100x100px, is fully within the viewport, but there is a 100x50px element overlayed on top of it, the visiblePixels would be [(100 * 100) - (100 * 50) = 5000]
Alternatively, we could put a list of overlaying rectangles inside each IntersectionObserverEntry as an array of IntersectionObserverEntry's, then let js client calculate how much of his target element is overlayed. But this gives us a bunch of extra cross-domain information that we (in advertising-land) really don't care about: the number and shape of overlaying elements, and also pushes more calculation onto the js side, when we really only want to know how much of our target element is visible.
The text was updated successfully, but these errors were encountered: