diff --git a/src/Align.tsx b/src/Align.tsx index e621863..f034249 100644 --- a/src/Align.tsx +++ b/src/Align.tsx @@ -141,6 +141,30 @@ const Align: React.RefForwardingComponent = ( cancelForceAlign(); } }, [disabled]); + + // listen scroll event + const scrollObserveRef = React.useRef<{ remove: () => void }>(); + React.useEffect(() => { + const element = getElement(target); + if (!element) return; + const listener = e => { + if (typeof e.target.contains === 'function') { + if (e.target.contains(element)) { + forceAlign(); + } + } + }; + window.addEventListener('scroll', listener, true); + scrollObserveRef.current = { + remove: () => { + window.removeEventListener('scroll', listener); + }, + }; + return () => { + scrollObserveRef.current && scrollObserveRef.current.remove(); + scrollObserveRef.current = null; + }; + }, [target]); // Listen for window resize const winResizeRef = React.useRef<{ remove: Function }>(null);