3

我们用cordova 开发了一个windows phone 8 应用程序。它工作正常,但在 windows phone8 8.0.10328.78发布后,页脚被破坏。我早些时候检查了代码,我得到视口的高度为 768,现在是 800。

这里有什么解决方案。

4

3 回答 3

2

我得到了解决方案

MainPage.xaml变化中

shell:SystemTray.IsVisible="True"

shell:SystemTray.IsVisible="False"
于 2013-11-27T17:40:34.920 回答
1

我最近在构建一个在 WebView 中运行的页面时遇到了这个问题。问题是视口高度......使用“height=device-height”使视口成为整个屏幕高度(减去应用程序托盘)。

我使用的修复方法是在高度 460 中声明一个初始值,然后在文档加载后动态替换该值。这种技术适用于所有设备(我已经测试过),包括 Windows、Android 和 iOS。

对于下面的示例,请记住不要将视口元标记从其当前位置移动,JS 针对头部中的第二个元标记,如果移动它,则需要相应地更新 JS。

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, user-scalable=no, width=device-width, height=460">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    ...
</head>

<body>
    ...
    <script>
        (function() {
            'use strict';

            var fixHeight = function() {
                var viewportHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
                var viewportWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;

                var viewportContent = 'initial-scale=1, user-scalable=no, width=device-width, height=' + viewportHeight;
                document.getElementsByTagName('META')[1].content = viewportContent;
            };

            window.addEventListener('load', fixHeight);
            window.addEventListener('resize', fixHeight);
         })();
    </script>
</body>
于 2015-12-14T05:49:37.093 回答
0

试着把它放在你的 CSS 中:

@-ms-viewport{
    width: device-width;
    height: device-height;
} 
于 2013-09-23T08:56:21.323 回答