如何在....仍然允许滚动时停止页面滚动？

Question

我正在使用PhoneGap制作移动应用。我有这个 -

function preventBehavior(e)
{
e.preventDefault();
};
document.addEventListener("touchmove",preventBehavior, false);

您知道如何通过拖动页面将页面拖离智能手机屏幕一小段距离，然后当您释放它时它会立即向后弹出？而你背后看到的只是黑色？这就是这段代码的意图。确实如此。

但它也阻止了所有标准滚动，例如滚动列表。有谁知道解决方案？

Answer 1

Cordova 1.7+的简易解决方案 在Xcode项目中找到Cordova.plist。 在顶部它会说“UIWebViewBounce”。将此设置为NO。

Answer 2

您有两种选择：

1. iScroll - 提供此效果非常有效。虽然它确实有它的局限性。

2. -webkit溢出滚动：触摸;在ios 5中引入了一种新的css方法它运行良好但又在phonegap中有其局限性。

我个人使用iScroll作为phonegap应用程序，如果您没有滚动的超大项目列表，它会很有用。如果你正在寻找一种更原生的方式，我会建议使用溢出滚动方法，这已经证明在webview中会产生一些奇怪的效果。 Phonegap使用webview vs mobile safari，所以你的支持有点不同。

iScroll - http://cubiq.org/iscroll-4 webkit-scrolling - http://johanbrook.com/browsers/native-momentum-scrolling-ios-5/

Answer 3

您应该在头标记中添加:(现在不需要您的侦听代码）

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />

这基本上禁用了缩放（放大/缩小）和你不想要的拖动效果。因此页面不会滚动但仍然可以跟踪事件触摸事件。