隐藏Safari ios上的方向转换

Question

我以为这是一个非常常见的问题，但实际上我没有找到任何答案。

我正在为移动设备制作网络应用程序/网站。 当用户旋转他的手机时，我想在页面旋转之前隐藏整个身体，并带有丑陋的变形/过渡。然后，当这个过渡完成后，再次显示身体。

here 我已经完成了适用于 android 的代码的最小版本。 正文上有来自loremPixel 的背景图片，html 标签上有红色背景。 预期的结果是：永远看不到图像旋转。只有红屏（也不旋转）

感谢您的帮助。

ps： 我想我已经将问题缩小到在 ios 上旋转 之后 和 之前 触发的orientationchange 事件>（如我所料）在 android 上

Answer 1

随机想法。

$(window).resize(function() {
    $("#wrapper").css("display","none");
    if(this.resizeTO) clearTimeout(this.resizeTO);
    this.resizeTO = setTimeout(function() {
        $(this).trigger('resizeEnd');
    }, 500);
});

$(window).bind('resizeEnd', function() {
    $("#wrapper").css("display","block");
});

开始调整大小，隐藏包装。 0.5 秒内没有调整大小，显示。

http://jsfiddle.net/7ktg9can/