react-intersection-observer
yarn add react-intersection-observer
Source: www.npmjs.com
react-intersection-observer
import React from 'react'; import { useInView } from 'react-intersection-observer'; const Component = () => { //ref pass in element inView is true when we move to ref part in webpage const { ref, inView, entry } = useInView({ /* Optional options */ threshold: 0, }); return ( <div ref={ref}> <h2>{`Header inside viewport ${inView}.`}</h2> </div> ); };
Source: www.npmjs.com