Question

问题：

我在iOS主屏幕上有一个Web应用程序，因此没有浏览器窗口，它的外观和功能非常好。我已经想出如何使内部div元素做触摸滚动事件并在iOS中使用动量/反弹风格，并且完美地运行...我现在遇到的问题是反弹滚动（再次，仅限iOS））弄乱了我在页面上的任何固定元素或与网站相关的动画。

当我尝试以下操作时：

document.ontouchmove = function(e) {e.preventDefault()};

问题停止，但现在我无法在我的应用程序上滚动任何地方。

我需要的是什么：

我希望身体完全锁定到位......如果有人抓住我的侧边栏或导航栏然后拉上页面，身体就会反弹！但如果有人在内容区域内，则根本没有问题 - 应用程序滚动完美且看起来很棒。如果我停止在侧边栏或导航栏或正文上滚动，则应用程序中的所有滚动都将无法正常工作，并且基本上无法正常工作。

tl; dr：身体在滚动时反弹。我想要一个滚动的内容区域，而不是其他地方的滚动。身体应该永远不会移动，但我认为可以在身体内滚动的元素应该。

作为旁注，我浏览了以下热门问题/解决方案（包括许多其他问题）：

我只是想在人们假设我没有做任何搜索之前发布这个...我已经在这几个小时了，并且已经看到了比上面发布的更多解决方案，但我想得到上面列出的最受欢迎的，所以没有人认为这是一个重复的问题。

Answer 1

几天前我想出了这个问题，并设置了这个方便的jsbin来展示我为完成这项工作所做的工作：

在iPad上打开此链接时，文本应该是可滚动的。当目前没有当前正在运行的touchmove事件时，请尝试拉动屏幕的其余部分。

如果你玩它，你会注意到只有内部文本字段按预期移动。这是通过将.scrollable类放在.container类中来确定的。 .scrollable类占用了它的父容器的整个高度。

现在让容器更高，如height: 500px。这里的目标是使它足够大，没有溢出，但又小到足以在iPad上有其他空白。尝试滚动或拉动它......没有触摸移动事件，屏幕就会停留在原位。

我的JS确定一个对象在被触摸后是否有溢出。如果是，则滚动。如果没有，则不发送滚动事件。

玩它并让我知道我是否可以提供任何更好的例子，如果你遇到任何错误...现在我唯一知道的是如果你真的试图打破它并开始拉扯正在触发当前touchmove事件的网站，或者页面首次加载...我不会将其视为“错误”，但如果您也可以找到这些修复程序，那我就全都是耳朵！