Question

我有以下代码：

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<style>
html    {
    background-color:yellow;
}
div {
    height:200px;
    overflow-y:scroll;
    background-color:red;
    margin-bottom:300px;
}
p   {
    margin-bottom:700px;
}
</style>

<p>This is top.</p>

<div>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

我的问题有点复杂。请按照以下步骤重现我的问题：

在iPhone等移动设备上的浏览器中打开此代码。
向下滚动到红色的可滚动div。
在这个红色的div中向下滚动一点。
现在通过将手指放在红色div中向上滚动。

您会看到，一旦到达红色div的顶部并且滚动得更多，就会出现反弹动画。

我想达到以下目的：一旦滚动到红色div的顶部并进行更多滚动，整个页面（正常的浏览器滚动行为）将得到滚动-而不是此弹跳动画。

这可能吗？

在移动设备上完成div滚动后滚动页面

0 个答案: