cordova - 防止在适用于 Windows Phone 8 的 Cordova 中滚动出 CordovaView

Question

在 Windows Phone 8 Cordova 应用程序中，我可以在应用程序中单击并水平拖动，然后平移/滚动越过显示器的水平边缘。请参阅 Cordova Windows Phone 8 独立模板应用程序：

水平平移越过 Cordova 应用程序的边缘

据我所知，此模板应用程序背后的 HTML 具有适当的视口规范：

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

此错误会阻止任何类型的滑动手势检测有用。iOS UIScrollView 控件有一个bounces属性，允许取消某种类似的效果。

这是科尔多瓦的虫子吗？是否可以在 Cordova WebBrowser 的容器上放置一些设置以使这种平移不会发生？

score 19 · Accepted Answer

标签上的两个额外 CSS 属性body修复了独立模板应用程序和我正在处理的原始应用程序中的平移问题：

body {
  overflow: hidden;
  -ms-content-zooming: none; }

此ms-content-zooming属性不限制作为元素子元素的body元素内的垂直滚动。

score 15 · Accepted Answer

请在您的 HTML 的主体标签中使用它...我已经修复了弹跳和橡皮筋效果。

 backface-visibility:hidden;
-webkit-backface-visibility:hidden;
 overflow: hidden;
-ms-content-zooming: none;
-ms-touch-action:none;

score 10 · Accepted Answer

这是一个真正有效的解决方案：

 <style>
    html {
        -ms-touch-action: pan-x;
        touch-action: pan-x;
    }

    body {
        -ms-touch-action: pan-y;
        touch-action: pan-y;
        -ms-content-zooming: none;
    }
</style>

这假设您的应用程序没有水平滚动（类似原生的混合应用程序不应该有）

score 8 · Accepted Answer

您可以在 MainPage.xaml.cs 文件中添加以下代码：

    // Constructor
    public MainPage()
    {
        InitializeComponent();
        .... // some default initialization code was here
        // and disable bouncy scrolling option:
        this.CordovaView.DisableBouncyScrolling = true;
    }

score 3 · Accepted Answer

正确的答案是添加this.CordovaView.DisableBouncyScrolling = true;到您的 MainPage.xaml.cs 文件中，但在这种情况下，您不能将其用于 Adobe Phonegap Build，因为无法提交此 xaml 文件。

score 2 · Accepted Answer

2

body { -ms-touch-action:none; }

于 2013-06-11T23:53:47.893 回答

score 1 · Accepted Answer

1

我们在主包装器上使用绝对位置，它修复了我们的用例。

于 2013-03-26T12:22:58.203 回答

score 0 · Accepted Answer

这解决了我的phonegap问题：

if (navigator.userAgent.match(/IEMobile/))
    {
        var ieBodyHeight = $("body").outerHeight();
        var ieBodyHeightNew = ieBodyHeight - 55;
        $("head").append('<meta name="viewport" content="height=' + ieBodyHeightNew + '" />');
    }

cordova - 防止在适用于 Windows Phone 8 的 Cordova 中滚动出 CordovaView

8 回答 8

Related

Reference