Phonegap + Windows Phone 8：視口元和縮放問題

Question

我目前正在開發一個Phonegap應用程序，在使用Windows Phone 8進行測試時遇到以下問題（左下方截圖）：應用程序欄未被刪除並留下很大的空白區域。

從各種 來源我了解到WP8忽略了以下元標記：

<meta name="viewport" content="width=device-width, height=device-height">

所以你必須使用“ms”預標記再次定義它：

@-ms-viewport {
    height: device-height;
    width: device-width;
}

但這樣做會讓應用程序的擴展變得混亂。 知道發生了什么事嗎？

這里是之前的截圖：

Answer 1

將其包含在Index.html中，

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, target-densitydpi=medium-dpi, user-scalable=0" />

在CSS中包含這個：

@viewport
{
width:320px;
}

@-ms-viewport {
width:320px;
zoom-user:fixed;
max-zoom:1;
min-zoom:1;
}

並包括這個，

body, html { 
  -ms-overflow-style: none !important; 
}

這將解決現在的問題，它在同樣的情況下對我有用.. !! :-)

Answer 2

你可以把這段代碼帶到你的css：

* {
    zoom:1;
    -ms-content-zooming:none;
}

這解決了我的問題。

Answer 3

有一個可用於視口修復的插件：

http://plugreg.com/plugin/lisovin/cordova-wp8-viewport