html - 粘性元素到父溢出容器

Question

注意:容器的位置必须是absolute 因为我的插件需要这样。

<div class = "container">
  <div id = "element1">
  </div>
  <div id = "element2">
  </div>
  <div id = "element3">
  </div>
</div>

.container {
  display: block;
  overflow-y: scroll;
  overflow-x: hidden;

  background-color: yellow;
}

#element1 {
  background-color: red;
}
#element2 {
  background-color: green;
}
#element3 {
  background-color: blue;
}

Answer 1

在您的标记中，#element3 位于 .container 内。

但是在你的图像中，#element3 在 .container 之外。

你有两个选择:

1. 编写标记，使 #element3 在 .container 之外；或
2. 添加选择 #element3 的 javascript，然后将其移到 .container 之外