$（window）.height（）在iPad全屏Web應用中不起作用

Question

我正在開發一個Web應用程序，該應用程序可以很好地顯示在iPad的移動Safari中。

當將快捷方式保存到跳板時，它會正確播放最終的效果，並且將正確的元標記放在一起以顯示跳板圖標，初始屏幕等。

不幸的是，該應用程序使用$(window).width()和$(window).height()並且經常（並非總是，而且不，我不能說什么時候，我為此而發瘋） $(window).height()調用返回0。

我必須知道根據視口大小和方向動態設置圖像寬度和高度的大小。 該應用程序還使用jQuery-ui和jQGrid，並且當高度計算為0時，它們都將中斷。

jq-ui對話框顯示在屏幕頂部而不是中間，並且表格也無法正確顯示。

Answer 1

可能的解決方法是：

height = window.innerHeight ? window.innerHeight : $(window).height()

在這里找到： http : //bugs.jquery.com/ticket/6724

Answer 2

碰巧這不是iPad問題！ 搜索並沒有結果后，我決定調查iPad發出並由asp.net執行的http請求和響應：事實證明，asp.net的內容類型設置為“ application / xhtml + xml”而不是“ text / html”，原因是來自http://mdbf.codeplex.com的 “ mobile.browser”文件中的錯誤，該錯誤將iPad應用程序/ xhtml + xml設置為preferredMimeType！ 將其重置為正確的類型后，一切正常。 我在這里答復，以防萬一有人可能會遇到相同的問題。 順便說一句，不再支持mdbf。 坦克全部

Answer 3

短暫延遲后嘗試檢查寬度和高度-例如：setTmeout（300）。

Answer 4

這是因為視口。 在常規屏幕上，它是基本的X x Y坐標平面。 在觸摸屏上，將視口想象成一小塊紙，您可以在大紙片（網站）上移動。 這是一篇可能有用的帖子：

移動Safari使用視口向您顯示網站。 想像一下您面前的書。 拿一張紙，切成320×416的正方形，然后放在書上。 要閱讀這本書，請四處移動紙張，並將孔定位在要查看的單詞上。 這正是Mobile Safari的視口正在執行的操作。 輕拂和滾動時，您將在視口周圍移動，而其后面的網站保持靜止。

由於此問題，您可能難以獲得所需的值。 以下是該帖子的鏈接。 希望這將為有關觸摸屏應用程序的定位提供一些啟示

http://doctyper.com/archives/200808/fixed-positioning-on-mobile-safari/

此外，Lee是正確的，您需要確保准備好文檔。