CSS: 另一个绝对元素中的绝对元素

Question

我在图1.1中创建了一个大div (div1)并将其设置为position: absolute。这个 div 是页面的内容容器，这个 div 里面是所有其他元素。我绝对这样做的原因 div 是为了消除浏览器中滚动时的弹跳：

Remove bounce on scroll in browser solution

我的问题是，如果我在大的里面有其他 absolute divs。在图1.1可以看到div2和position:absolute，如果div1是滚动的，div2的行为就像一个固定的元素。 Div2 只是一个例子，我有很多像 Popovers 这样的绝对元素，不能选择相对的。

我怎么能对 div2 （在图 1.1 示例中） 说当 div1 滚动时随着页面滚动？

代码示例

html, body {
    height: 100%;
    overflow: hidden;
}

.div1 {
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   overflow: auto;
}

div2{
   position: absolute;
}

图像示例（图 1.1）

正确的方法

我知道有很多相关的答案，但它们都与我的问题大不相同。

相关问题：

Absolute positioning inside absolute position

Answer 1

我有其他解决方案。为了修复 iPad 过度滚动，我写了一个小脚本，修复了 "scroll bouncing" / "overscroll"

https://github.com/aiboy/PerfectScrollFix

首先，您不需要彻底改变布局并使用绝对 div。其次，滚动仍然是 "native".

你有两个问题： 1) 目前只支持水平滚动修复 2) 你的内容（将被滚动）应该被包裹在一个单一的元素中（wrapper）

您可以在 iPad 上测试此脚本：http://jsbin.com/usomob/4

示例源代码http://jsbin.com/usomob/4/edit

CSS: 另一个绝对元素中的绝对元素

CSS: absolute element inside an another absolute element

html

javascript

css

styling

代码示例

图像示例（图 1.1）

正确的方法