Windows Phone 8 WebView頁面不是靜態的（jQuery Mobile/PhoneGap）

不明確標題的道歉;但是我試圖將在Android和iOS上正常工作的PhoneGap應用程序移植到Windows Phone 8（用jQuery Mobile/JavaScript，HTML和CSS3編寫）。Windows Phone 8 WebView頁面不是靜態的（jQuery Mobile/PhoneGap）

它的大部分工作（雖然我不得不改變幾個位，但這是預期的）。我目前遇到的一個主要問題是獲取應用程序的滾動列表功能以及簽名捕獲（我相信這兩者都有關聯）。我不太確定問題出在哪裏，但當我滾動/簽名時，整個頁面會隨着我的手指移動，而且各個元素不會接觸到觸摸事件。我正在使用iScroll，jQuery 1.7.2和jQM 1.1.0;然而，繼續閱讀，因爲滾動功能是工作（簽名功能一直是一個問題）！

之前滾動停止工作，我是有頁腳欄和頁面底部之間的差距的問題：

jQuery Mobile Gap

有一兩件事，我被告知要做的就是添加以下位的CSS;它解決了「差距」的問題：

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

jQuery Mobile Gap Fix

然而，隨後引起了滾動功能變得反應遲鈍。整個頁面向上/向下移動，但不是與我想要的相反的列表元素！我試着加入以下，但沒有運氣：

-ms-touch-action: none;

我說這其中包含的頁面我的div元素。它停止了頁面的上下移動！但是名單仍然沒有反應。但是，如果我刪除了這兩個CSS類，那麼滾動功能再次起作用，但是這又重新引入了差距問題。視圖CSS類絕對是我相信的正確路線 - 但我不能在我的生活中按照自己喜歡的方式工作。

如果有人可以幫忙，將不勝感激。

謝謝。

來源

2013-02-27 keldar

你已經解決了嗎？ – 2013-05-07 13:04:41

得到了同樣的問題！ – 2013-07-19 14:36:59

你可以發佈列表的HTML和CSS嗎？據我所知，整個頁面上下移動，但你只想列表組件滾動，正確？ – 2013-07-24 10:19:14

首先，@ -ms-viewport不支持縮放，所以刪除縮放屬性是因爲它們會生成解析錯誤。支持的屬性列here

其次，嘗試將此規則添加到您的CSS和你說在你的中央容器使用iScroll你在做

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

body { 
    overflow: hidden; 
    -ms-user-select: none; 
    -ms-content-zooming: none; 
    -ms-touch-action: none; 
}

來源

2013-09-23 08:51:39

你可以在你的CSS中使用它，它會修復你的頁腳。

[data-role=footer]{bottom:0; position:absolute !important; top: auto !important; width:100%;}

來源

2013-09-02 11:03:40 Tharu

Windows Phone 8 WebView頁面不是靜態的（jQuery Mobile/PhoneGap）

回答

相關問題