30 lines
683 B
JavaScript
30 lines
683 B
JavaScript
|
/**
|
||
|
|
* External dependencies
|
||
|
|
*/
|
||
|
|
import { useEffect, useRef, useState } from '@wordpress/element';
|
||
|
|
|
||
|
|
export default function useIsScrolled() {
|
||
|
|
const [ isScrolled, setIsScrolled ] = useState( false );
|
||
|
|
const rafHandle = useRef( null );
|
||
|
|
useEffect( () => {
|
||
|
|
const updateIsScrolled = () => {
|
||
|
|
setIsScrolled( window.pageYOffset > 20 );
|
||
|
|
};
|
||
|
|
|
||
|
|
const scrollListener = () => {
|
||
|
|
rafHandle.current = window.requestAnimationFrame(
|
||
|
|
updateIsScrolled
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
window.addEventListener( 'scroll', scrollListener );
|
||
|
|
|
||
|
|
return () => {
|
||
|
|
window.removeEventListener( 'scroll', scrollListener );
|
||
|
|
window.cancelAnimationFrame( rafHandle.current );
|
||
|
|
};
|
||
|
|
}, [] );
|
||
|
|
|
||
|
|
return isScrolled;
|
||
|
|
}
|