32 lines
830 B
TypeScript
32 lines
830 B
TypeScript
import { useEffect, useState } from 'react';
|
|
|
|
const useScroll = () => {
|
|
const [ isScrolledX, setIsScrolledX ] = useState(false);
|
|
const [ isScrolledY, setIsScrolledY ] = useState(false);
|
|
const [ scrollX, setScrollX ] = useState(0);
|
|
const [ scrollY, setScrollY ] = useState(0);
|
|
|
|
const handleScroll = () => {
|
|
const x = window.scrollX;
|
|
const y = window.scrollY;
|
|
|
|
setScrollX(x);
|
|
setScrollY(y);
|
|
setIsScrolledX(x > 0);
|
|
setIsScrolledY(y > 0);
|
|
};
|
|
|
|
useEffect(() => {
|
|
window.addEventListener('scroll', handleScroll);
|
|
|
|
// Cleanup listener on unmount
|
|
return () => {
|
|
window.removeEventListener('scroll', handleScroll);
|
|
};
|
|
}, []);
|
|
|
|
return [ isScrolledX, isScrolledY, scrollX, scrollY ];
|
|
};
|
|
|
|
export default useScroll;
|