React Component that observe changes in the intersection of a target element with viewport using IntersectionObserver
npm install viewport-observer
> React Component that observe changes in the intersection of a target element with viewport using IntersectionObserver
``bash`
$ npm install --save viewport-observer
This package depends on IntersectionObserver, so you probably need to polyfill via w3c/IntersectionObserver Polyfill before using this package.
`jsx
// you probably need to polyfill
import 'intersection-observer';
import ViewportObserver from 'viewport-observer';
...
onEnter={() => console.log('onEnter')}
onLeave={() => console.log('onLeave')}>
You can call
of ViewportObserver instance to stop observing and dispose IntersectionObserver instance.Config
| Property | Type | Default Value |
| ----------- | ---------- | ------------- |
| tagName |
String | div |
| display | String | '' |
| onChange | Function | () => {} |
| onEnter | Function | () => {} |
| onLeave | Function | () => {} |
| root | Node | null |
| rootMargin | DOMString | 0px |
| threshold | Array | [0]` |- openfresh/super-image: React component that render a image with object-fit and its fallback
MIT © FRESH!