Javascript 如何使用鼠标在内容上滚动可滚动的div？

朋友们，有没有什么方法可以让这个div滚动，即使是用鼠标在盒子上

Html:

---

我试图用溢出来制作一些东西，但任何东西都起作用了。

您已将这些元素设置为

位置：已修复。这将相对于浏览器定位元素，这意味着它们将完全从其父元素流中移除。当然，当您将鼠标悬停在它们上方时，容器不会滚动

您可以在这些框上使用
指针事件：none
，但并非所有浏览器都支持这一点。此外，还不清楚将来是否真的需要这些元素中的指针事件

我的建议是删除可滚动div。确保body/document是唯一滚动的元素。这样，无论您当前在哪个元素上滑动鼠标，内容都将滚动

.list-item {
  display: inline-block;
  width: 150px;
  height: 150px;
  pointer-events:none;
}

这样就行了

示例：
您能解释一下您希望它如何滚动，以及鼠标悬停在内容上是什么意思吗？容器是可滚动的，但当我将鼠标悬停在框上并尝试滚动时，什么都没有发生。我也想在鼠标放在盒子顶部时滚动容器，你知道吗？我添加了一个答案，使用CSSso做你想做的事是不可能的，做我想做的事吗？@Amandaferari我会这么说，但可能有人会想出一个解决方案。
    .container {
        width: 100%;
        height: 400px;
        border: 1px solid black;
        overflow: scroll;
        color: white;
    }
    .container-scroll {
        width: 100%;
        height: 4000px;
    }
    .list {
        list-style: none;
        position: fixed;
    }
    .list-item {
        display: inline-block;
        width: 150px;
        height: 150px;
    }
    .list-item.one {
        background: pink;
    }
.list-item.two{
        background: black;
  float: right;
    }

.list-item {
  display: inline-block;
  width: 150px;
  height: 150px;
  pointer-events:none;
}