主页 / 问题 / 1275961
Accepted
Body
Asked:2022-04-28 19:09:20 +0000 UTC2022-04-28 19:09:20 +0000 UTC

跟随滚动元素

  • 772

请帮助实现，以便在页面滚动时，容器被固定，当到达下一个块时，容器停止。

javascript

1 个回答

  1. Best Answer

    我认为 position: sticky 适合你。这是一个例子：

    .content {
  position: relative;
}

.dummy {
  height: 200px;
}

.wrapper {
  position: absolute;
  height: 1000px;
}

.sticky {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  background-color: lime;
  top: 100px;
  width: 100px;
  height: 20px;
}
    <div class="content">
  <div class="wrapper">
    <div class="sticky"></div>
  </div>
  <div class="dummy">qwerty</div>
  <div class="dummy">qwerty</div>
  <div class="dummy">qwerty</div>
  <div class="dummy">qwerty</div>
  <div class="dummy">qwerty</div>
  <div class="dummy">qwerty</div>
  <div class="dummy">qwerty</div>
  <div class="dummy">qwerty</div>
</div>

    • 2

相关问题