(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)，然后将 windowHeight 更改为 windowHeight * 0.5 或类似的东西。这是最好的解决方案吗？还是有更简单的？

Answer 1

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