iPhone HTML5 App滚动问题

Question

我不知道这是否可能,或谷歌找到它,但你可以添加:

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

它会使它不能左右滚动,只能上下滚动.是否有一种方法可以做到这一点,当你到达终点时它不会做那种过度滚动效果但是继续滚动然后它会弹回来？像Cocoa应用程序一样,我注意到"过度滚动"有时它们具有相同的背景颜色,因此它看起来不像Safari,或者它根本不执行它？

Answer 1

您所谓的过度滚动被称为反弹.不幸的是,没有一种记录的方法来关闭UIWebView中的反弹.您可以查看UIScrollView以获取与弹跳相关的方法.UIWebView拥有UIScrollView但不公开它.

要防止水平滚动,您只需确保您的网页适合视口.不适合的一个常见原因是当身体边缘不为零时,100%宽度的项目.

您可以通过向文档添加触摸事件处理程序并在事件上调用preventDefault来完全阻止滚动和弹跳.如果您的网页完全适合视口,这将有效禁用退回.

function stopScrolling( touchEvent ) { touchEvent.preventDefault(); }
document.addEventListener( 'touchstart' , stopScrolling , false );
document.addEventListener( 'touchmove' , stopScrolling , false );

编辑:

UIWebView主要来自Objective-C端,但可以从javascript端访问.如果您不控制正在加载的内容,则可以注入javascript.

Answer 2

如果您使用的是Cordova 1.7+,只需打开Cordova.plist文件并将密钥设置UIWebViewBounce为NO

在Cordova 2.3+中,现在是config.xml,您需要将其设置为false.