在縮放（僅橫向）下在Safari（iOS 7）上調整事件的大小？

Question

我正在嘗試解決可能在其他人遇到的iOS 7版本中出現的行為變化問題。

我們在網站中有一些處理調整大小事件的代碼。 理想情況下，此方法的工作方式是：如果您正在縮放（例如，手機上的捏縮縮放），它將不會執行，但是例如，如果您調整瀏覽器窗口的大小，則可能會觸發該操作。

我們發現，在我們的iOS 7設備上，Safari會在進行縮放時頻繁觸發javascript大小調整事件。 這並非一直發生，而似乎僅在橫向模式下發生。 我們的iOS6設備沒有做到這一點，我們手頭上的任何Android設備也沒有做到這一點。 這些有兩個不良影響：

1）它似乎導致頁面“跳轉”，即它將突然將頁面重新定位，通常到左上角。 請注意，即使沒有調整大小事件處理程序，也會發生這種情況。

我認為這不是我們的頁面布局。 我們一直特別小心，避免可能導致行為的事物，例如小數像素以及高度和寬度的百分比。 另外，我們可以通過將視口寬度（通過META標簽）設置為700px或更小來消除這種現象。 另外，如前所述，我們在個人資料中看不到任何此類問題。 （我們沒有設置任何其他視口設置，所以這不是問題；設置“ width = client-width”對我們沒有幫助。

2）似乎在調整大小處理程序中，它並沒有真正為我們提供window.innerWidth;的期望值； 即我將被放大，它將給我一個大於預期的值。 例如，我通常使用類似這樣的方法來確定我們是否正在縮放：

abs（1-document.documentElement.clientWidth / window.innerWidth）<0.02

但這似乎並不能解決問題。

不幸的是，由於調整大小的邏輯會重新格式化頁面，因此我們將不得不解決此問題。 該頁面本質上是自定義的在線報告，經常查看風景樣式。 我們不能僅僅告訴我們的用戶不要縮放或旋轉手機；-)

有沒有人遇到這些問題？ 如果是這樣，您是如何解決的？

順便說一句：有沒有人發現最新的7.0.3野生動物園更新有時不能讓您清除JavaScript警報（即警報上的“確定”按鈕不起作用，導致野生動物園掛起）？ 我知道iOS 7.0.3更新已解決了警報問題，但也許還有其他我不知道的問題。 進入此狀態后，我們必須重新啟動設備。

Answer 1

這是我們如何使橫向模式下的“頁面跳轉”消失的方法。 這不是一個“好的”解決方案，因為我們不知道它為什么起作用。 我們將視口元標記設置為以下內容：

<meta name="viewport" content="width=1920 height=1080"/>

我懷疑這些特定的數字是否“神奇”-似乎只要指定了寬度和高度，頁面跳轉就消失了。 也許沒有高度，從設備縱橫比計算高度會導致頁面重新布局時出現錯誤？ （請參閱Kamen Bundev在http://www.kendoui.c​​om/forums/kendo-ui-mobile/application/ios-7-safari-window-height-.aspx中有關橫向模式下錯誤報告的窗口高度的帖子；不幸的是，我還沒有找不到其他任何引用此特定錯誤的信息）。

我們發現問題似乎與HTML並排布置的表有關。 我已經做過實驗，並且只要視口寬度足夠大以允許表格彼此相鄰放置，您就很可能會看到該錯誤。