javascript - bootstrap 4 仅滚动中间列/facebook 像滚动

Question

我在 bootstrap 中有 3 列，我希望只滚动中间的部分，同时保持相对于父容器的位置。类似 Facebook 滚动的东西

<div class="container">
  <div class="row">
    <div class="col-md-3">stop scrolling when content end </div>
    <div class="col-md-6"> SCROLL </div>
    <div class="col-md-3"> stop scrolling when content end </div>
  </div>
</div>

我尝试使用固定位置，但是当我使用它时，它会扰乱网格系统，这就是为什么我希望位置尽可能保持相对于父级的原因。

Answer 1

如果我理解这个问题，你可以像这样使用sticky-top...

https://www.codeply.com/go/IL1wlzpNEP

<div class="container">
  <div class="row">
    <div class="col-md-3"> <div class="sticky-top">side</div> </div>
    <div class="col-md-6"> SCROLL </div>
    <div class="col-md-3"> <div class="sticky-top">side</div> </div>
  </div>
</div>

中间的列将滚动其内容的长度。