(window).height() 用于 iPad 屏幕

Question

我的网站上有一个弹出窗口。 弹出窗口打开后，我调整其大小以占据大部分屏幕：

jQuery( window ).resize(function() {
    var windowHeight = jQuery(window).height();
    jQuery('#BookingFrame').css('height', windowHeight * 0.9 | 0);
});

问题：在 iPad 上，窗口调整大小超过视口，弹出窗口的下半部分消失。实际上，没有办法在iPad上填写表格。

我在这里看到了很多关于"为什么"的解释，但我无法找到可行的解决方案。这些论坛中建议的任何更改都会导致在其他设备上破坏页面或网站的另一部分。

我想我需要识别设备($device==iPad(，然后将窗口高度更改为窗口高度* 0.5或类似的东西。这是最好的解决方案吗？还是有更简单的东西？

Answer 1

根据您需要支持的浏览器，您可以使用 vh 单位而不是 px/rem/%，这样您就无需 js 来调整弹出窗口的大小。