import { useState, useEffect } from 'react';
import debounce from 'lodash/debounce';
export function useScroll() {
const [scrollY, setScrollY] = useState<number>(0);
const listener = () => {
setScrollY(window.pageYOffset);
};
const delay = 15;
useEffect(() => {
window.addEventListener('scroll', debounce(listener, delay));
return () => window.removeEventListener('scroll', listener);
});
return {
scrollY
};
}
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter