css - 如何在父级滚动条上设置粘性div

当它离开屏幕时，我尝试使div粘滞。

我发现了这个例子

https://codepen.io/geddski/pen/rjYpVr

<sidescroller>
...
</sidescroller>

但就我而言，我滚动了他的父容器。

我的情况：

https://codepen.io/anon/pen/QzNWad

<div class="test">
<sidescroller>
...
</sidescroller>
</div>

是否可以使我的案件起作用？

谢谢

最佳答案

在您的width: 100vw;中添加position: fixed;和sidescroller可以达到目的：

sidescroller{
  display: flex;
  align-items: center;
  overflow-x: auto;
  overflow-y: hidden;
  background: #000;
  width: 100vw;
  position: fixed;
}

Working codepen

关于css - 如何在父级滚动条上设置粘性div，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/53781849/