无法滚动到我的视差组件中，只有在移动鼠标时才会触发其中的滚动

Question

我正在做一个网页，我在它的中间有一个视差组件，当我从页面的顶部到底部滚动时，并且视差出现，滚动不会触发它，只有当我停止时鼠标在视差元素内停留片刻，浏览器触发滚动到该元素。

我在stackoverflow上看到了这个问题，但响应对我不起作用。 这是我尝试过的：

1. 创建了一个handleScroll function

const handleScroll = () => {
    ref.current.container.current.click();
};

2. 将 ref 设置为 Parallax wrapper <Parallax ref={ref} pages={4} className={styles.parallax}>
3. 添加了一个 onMouseOver 侦听器来触发 handleScroll 以便元素自行点击它

          <Parallax
            ref={ref}
            pages={4}
            className={styles.parallax}
            onMouseOver={handleScroll}
            onClick={() => console.log(`i was clicked`)}
          >

这不起作用，当我快速滚动时，无法识别 onmouseover，还有其他方法可以触发对我的视差的点击，以便获得焦点并且浏览器开始滚动它而不是主要内容滚动条？