Please note, this is a STATIC archive of website from 03 Nov 2016, does not collect or store any user information, there is no "phishing" involved.



我们的志愿者还没有将这篇文章翻译为 中文 (简体)加入我们帮助完成翻译!

This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.

The IntersectionObserver interface of the the Intersection Observer API provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with a top-level document's viewport. The ancestor or viewport is referred to as the root.


Creates a new IntersectionObserver object.


IntersectionObserver.root Read only
A specific ancestor of the element being observed. If no value was passed to the constructor, the top-level document's viewport is used.
IntersectionObserver.rootMargin Read only
An offset applied to the root's bounding_box when calculating intersections, effectively shrinking or growing the root for calculation purposes. This is not guaranteed to be identical to the value passed in the constructor. If no value was passed to the constructor, "0px 0px 0px 0px" is used. This property takes pixels ('px') or percentages ('%').
IntersectionObserver.thresholds Read only
A list of thresholds, sorted in increasing numeric order, where each threshold is a ratio of intersection area to bounding box area of an observed target. Notifications for a target are generated when any of the thresholds are crossed for that target. If no value was passed to the constructor, 0 is used.


Stops the IntersectionObserver object from observing any target.
Tells the IntersectionObserver a target element to observe.
Returns an array of IntersectionObserverEntry objects for all observed targets and stops observing all of them.
Tells the IntersectionObserver to stop observing a particular target element.


var intersectionObserver = new IntersectionObserver(function(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;

  console.log('Loaded new items');
// start observing


Specification Status Comment
Intersection Observer
The definition of 'IntersectionObserver' in that specification.
Editor's Draft Initial definition.

Browser Compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support


? ? ? ?
Feature Android Android Webview Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support No support 51.0 ? ? ? ? ? 51.0


 此页面的贡献者:, jpmedley