diff --git a/packages/react-select/src/internal/useScrollCapture.ts b/packages/react-select/src/internal/useScrollCapture.ts
index 6452d6564e..a454b6530f 100644
--- a/packages/react-select/src/internal/useScrollCapture.ts
+++ b/packages/react-select/src/internal/useScrollCapture.ts
@@ -25,9 +25,10 @@ export default function useScrollCapture({
   const isTop = useRef(false);
   const touchStart = useRef(0);
   const scrollTarget = useRef<HTMLElement | null>(null);
+  const previousScrollTop = useRef(0);
 
   const handleEventDelta = useCallback(
-    (event: WheelEvent | TouchEvent, delta: number) => {
+    (event: WheelEvent | TouchEvent | React.UIEvent<HTMLElement, UIEvent>, delta: number) => {
       if (scrollTarget.current === null) return;
 
       const { scrollTop, scrollHeight, clientHeight } = scrollTarget.current;
@@ -73,9 +74,11 @@ export default function useScrollCapture({
     [onBottomArrive, onBottomLeave, onTopArrive, onTopLeave]
   );
 
-  const onWheel = useCallback(
-    (event: WheelEvent) => {
-      handleEventDelta(event, event.deltaY);
+  const onScroll = useCallback(
+    (event: React.UIEvent<HTMLElement>) => {
+      const deltaY = event.currentTarget.scrollTop - previousScrollTop.current;
+      previousScrollTop.current = event.currentTarget.scrollTop;
+      handleEventDelta(event, deltaY);
     },
     [handleEventDelta]
   );
@@ -97,11 +100,11 @@ export default function useScrollCapture({
       if (!el) return;
 
       const notPassive = supportsPassiveEvents ? { passive: false } : false;
-      el.addEventListener('wheel', onWheel, notPassive);
+      el.addEventListener('scroll', onScroll, notPassive);
       el.addEventListener('touchstart', onTouchStart, notPassive);
       el.addEventListener('touchmove', onTouchMove, notPassive);
     },
-    [onTouchMove, onTouchStart, onWheel]
+    [onTouchMove, onTouchStart, onScroll]
   );
 
   const stopListening = useCallback(
@@ -109,11 +112,11 @@ export default function useScrollCapture({
       // bail early if no element is available to detach from
       if (!el) return;
 
-      el.removeEventListener('wheel', onWheel, false);
+      el.removeEventListener('scroll', onScroll, false);
       el.removeEventListener('touchstart', onTouchStart, false);
       el.removeEventListener('touchmove', onTouchMove, false);
     },
-    [onTouchMove, onTouchStart, onWheel]
+    [onTouchMove, onTouchStart, onScroll]
   );
 
   useEffect(() => {