docu v 1.11.0
This commit is contained in:
28
hooks/useScrollPosition.ts
Normal file
28
hooks/useScrollPosition.ts
Normal file
@@ -0,0 +1,28 @@
|
||||
import { useState, useCallback, useEffect } from 'react';
|
||||
|
||||
export function useScrollPosition(threshold = 0.5) {
|
||||
const [isScrolled, setIsScrolled] = useState(false);
|
||||
|
||||
const handleScroll = useCallback(() => {
|
||||
if (typeof window === 'undefined') return;
|
||||
|
||||
const scrollPosition = window.scrollY;
|
||||
const viewportHeight = window.innerHeight;
|
||||
const shouldBeSticky = scrollPosition > viewportHeight * threshold;
|
||||
|
||||
setIsScrolled(prev => shouldBeSticky !== prev ? shouldBeSticky : prev);
|
||||
}, [threshold]);
|
||||
|
||||
// Add scroll event listener
|
||||
useEffect(() => {
|
||||
// Initial check
|
||||
handleScroll();
|
||||
|
||||
window.addEventListener('scroll', handleScroll, { passive: true });
|
||||
return () => {
|
||||
window.removeEventListener('scroll', handleScroll);
|
||||
};
|
||||
}, [handleScroll]);
|
||||
|
||||
return isScrolled;
|
||||
}
|
||||
Reference in New Issue
Block a user