logo标签列表

如何防止使用PhoneGap开发的应用程序在垂直方向上滚动？

iphoneioscordova
60

我正在尝试使用PhoneGap，我希望我的应用在用户拖动手指时不会上下滚动。这是我的代码。有人能告诉我为什么它仍然允许滚动吗？

   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta name = "viewport" content = "user-scalable=no,width=device-width" />
    <!--<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />-->

    <meta http-equiv="Content-type" content="text/html; charset=utf-8">

    <!-- iPad/iPhone specific css below, add after your main css >
    <link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" />        
    <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" />       
    -->
    <!-- If you application is targeting iOS BEFORE 4.0 you MUST put json2.js from http://www.JSON.org/json2.js into your www directory and include it here -->
    <script type="text/javascript" charset="utf-8" src="phonegap.0.9.5.1.min.js"></script>
    <script type="text/javascript" charset="utf-8">


    // If you want to prevent dragging, uncomment this section
    /*
    function preventBehavior(e) 
    { 
      e.preventDefault(); 
    };
    document.addEventListener("touchmove", preventBehavior, false);
    */

    /* If you are supporting your own protocol, the var invokeString will contain any arguments to the app launch.
    see http://iosdevelopertips.com/cocoa/launching-your-own-application-via-a-custom-url-scheme.html
    for more details -jm */
    /*
    function handleOpenURL(url)
    {
        // TODO: do something with the url passed in.
    }
    */

    function onBodyLoad()
    {       
        document.addEventListener("deviceready",onDeviceReady,false);
    }

    /* When this function is called, PhoneGap has been initialized and is ready to roll */
    /* If you are supporting your own protocol, the var invokeString will contain any arguments to the app launch.
    see http://iosdevelopertips.com/cocoa/launching-your-own-application-via-a-custom-url-scheme.html
    for more details -jm */
    function onDeviceReady()
    {
        // do your thing!
        navigator.notification.alert("PhoneGap is working")
    }
    touchMove = function(event) {
        // Prevent scrolling on this element
        event.preventDefault();
    }

</script>
<style>
#container {
width:100%;
height:100%;
}
</style>

</head>

    <body onload="onBodyLoad()">
        <div id="container" ontouchmove="touchMove(event);">
        </div>
    </body>
</html>
14个回答
1
现在您只需将<preference name="DisallowOverscroll" value="false" />更改为<preference name="DisallowOverscroll" value="true" />并放置在您的config.xml文件中即可。
0

首先，您需要在body unload方法中添加事件监听器。

只需将此行放入touch move方法中即可。

它不会滚动 document.addEventListener("touchstart/touchmove/touchend")。这三个中的任何一个都可以。

function touchMove (event e) {
    e.preventDefault;
}
0
如果您在.plist文件中将UIWebViewBounce设置为NO，则可以使用简单的CSS使内容不可滚动。尝试在要禁用滚动的div中添加此样式overflow：hidden。
0
在您的项目的config.xml文件中，iOS的首选项下将DisallowOverscroll设置为true。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接