window.innerWidth/Height 未在 WKWebView 的调整大小处理程序中更新 [英] window.innerWidth/Height not updated in resize handler in WKWebView

问题描述

我有一些全屏网页内容，当窗口使用 resize 事件改变大小时，我会更新这些内容.

I have some fullscreen web content that I update when the window changes size using the resize event.

window.onresize = function()
{
    var width = window.innerWidth;
    var height = window.innerHeight;
    ...
}

这在 Safari 应用程序中运行良好，但在 WKWebView 中不起作用.当设备在 WKWebView 中更改 iPhone 和 iPad 上的屏幕方向时，它给了我错误的窗口尺寸.

This works fine in the Safari app but it is not working in a WKWebView. It is giving me the wrong window dimensions when the device changes screen orientations on both iPhone and iPad in a WKWebView.

特别是对于 iPad，我在导航控制器中显示 Web 视图.当我切换到纵向模式时，我得到的是 (768x768) 尺寸而不是 (768x960)，这是正确的尺寸.

Specifically for iPad I am showing the web view in a navigation controller. When I switch to portrait mode I get (768x768) dimensions instead of (768x960) which are the correct dimensions.

是否有解决此问题的方法?

Is there a workaround to this issue?

推荐答案

似乎 window.clientWidth/window.clientHeight 在调整大小事件之前没有更新火灾.

It seems like window.clientWidth / window.clientHeight don't get updated before the resize event fires.

我找到了两个解决此问题的方法:

I found two solutions to the issue:

• 使用 document.documentElement.clientWidth 而不是 window.innerWidth
• 监听 orientationchange 事件而不是 resize 事件(window.clientWidth 似乎此时已经更新)

• use document.documentElement.clientWidth instead of window.innerWidth
• listen to the orientationchange event instead of the resize event (window.clientWidth seems to be already updated at this point)

这篇关于window.innerWidth/Height 未在 WKWebView 的调整大小处理程序中更新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！