在不禁用滚动功能的情况下防止iOS反弹

我正在尝试实现一个解决方案,以防止在Safari for iOS中当网页内容大于视口时出现iOS反弹效果

我正在处理的页面在结构上非常具体,与此页面非常相似http://new.salt.ch/

  • 基本结构是基于bootstrap的
  • 它的顶部有一个固定的导航栏
  • 它有一个全屏背景幻灯片
  • 幻灯片放映有一个固定在视口底部的覆盖
  • 有一个页脚元素从画布上加载,并且仅在滚动内容时可见
  • 内容在导航栏后面滚动
  • 内容包括位于导航栏下方20px的标题和位于视口上方20px的一系列按钮
  • 滚动时,按钮和标题都会在屏幕上向上移动以显示页脚

我遇到的问题与页面上的问题相同http://new.salt.ch/ 这样,当你向上滚动时,屏幕底部会出现反弹效果,显示背景和覆盖

我已经尝试过各种解决方案,包括iNoBounce.js、Nonbounce.js和我发现的其他一些建议

我总是有同样的问题…当我尝试禁用反弹时,所有滚动都被禁用。我猜这是因为内容(除了页脚)总是足够大,不需要滚动,所以滚动被禁用,页脚在滚动中不再可访问

这段代码应该停止跳出,因为跳出的是HTML标记

html{
身高:100%;
溢出:隐藏;
位置:相对位置;
}
身体{
身高:100%;
溢出:自动;
位置:相对位置;
}

发表评论