当鼠标悬停在具有绝对位置的按钮上时滚动内容（按钮应保持可点击状态）

Question

我试图在鼠标悬停在 div 或按钮上时滚动内容。这很重要，因为如果您无法滚动，就会感觉应用程序被卡住了。但该按钮应保持可点击状态。关于如何实现这一点的任何想法？

复制步骤

1. 打开示例https://codesandbox.io/s/relaxed-wood-bqhxh?file=/src/App.js
2. 将鼠标悬停在绿色按钮上
3. 用鼠标滚轮滚动

期望的行为 你可以滚动容器

实际行为 你不能滚动容器

附言我知道你可以使用pointer-events: none 以便继续滚动，但这会阻止按钮点击。

Answer 1

我可以通过将按钮上的滚轮事件扩展为可滚动 div 上的滚动事件来实现这一点。

查看这支笔： https://codesandbox.io/s/charming-forest-z8f9b

注意：这可能不是最佳解决方案。但是，它适用于您的情况！