Question

我在HTML5网络应用中使用了一个固定的页脚。它在IE10手机浏览器上工作正常，但是当我在WP8模拟器上使用web-view

进行试用时

mainBrowser.Navigate(new URi("http://jqtouch.rediffmailpro.com/iScroll/win8Example1.html",URiKind.Absolute));

底部留有空隙。

我在某处读了它，并编辑了元标记以包含高度。

<meta name="viewport" content="width=device-width, height=541 initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">

差距消失了。但是，我认为这不是一个好主意，因为在方向改变时页脚会丢失，因为高度仍然是541.我不想在任何地方硬编码高度，因为多个设备可能有不同的高度。

似乎没有为css正确设置视口高度。我使用的是底部：0;位置：绝对的;修复页脚。我试过了位置：修复了。

以下是参考链接：WP8 Scroll Demo

请帮忙。

Answer 1

使用iscroll4并在css中使用少量媒体查询：

@media screen and (orientation: portrait) {
  @-ms-viewport {
    width: 320px;
    user-zoom: fixed;
    max-zoom: 1;
    min-zoom: 1;
  }
}

@media screen and (orientation: landscape) {
  @-ms-viewport {
    width: 480px;
    user-zoom: fixed;
    max-zoom: 1;
    min-zoom: 1;
  }
}

这在Windows Mobile 8手机上运行良好。这是一个演示：http://jqtouch.rediffmailpro.com/iScroll/win8Example.html

修复了WP8模拟器上的页脚问题

1 个答案: