javascript - iOS6 Safari 全屏检测

我想在iOS6中利用Safari的新全屏功能。现在我知道不可能从 javascript 触发全屏功能，这没关系，但我想知道用户何时进入全屏模式。 (显示带有文本“此网站最好在全屏模式下查看”的弹出窗口，直到用户全屏显示。)

我尝试设置窗口、文档和“包装器”div(宽度和高度在 css 中设置为 100%)onresize 事件(通过普通的 javascript 和 jQuery 的“resize”事件)，但它们不会被触发我进入全屏模式。

我还设置了一个间隔来检查屏幕/文档/包装器的宽度和高度的变化，但它们没有显示任何变化。

有没有其他方法可以确定用户是否进入(或离开)全屏模式？

最佳答案

好吧，我真的不知道为什么它以前不起作用，但我责怪新的 safari ios 调试控制台(现在需要在你的 mac 上通过 safari)，因为它并不总是显示我发送的所有日志到控制台。

但是，当我只是将消息附加到 html 文档本身的正文时，事件就起作用了。将 jQuery 'resize' 事件绑定(bind)到窗口似乎是最好的选择。

文档高度在非全屏时约为 200，全屏时为 320。

最简单的解决方案似乎有效。 (只需将其与方向更改功能结合使用，即可检测iPhone是否处于横向模式(http://ajaxian.com/archives/iphone-windowonorientationchange-code))。

    $(window).on('resize', function(){
        if ($(this).height() > 300 &&
           (window.orientation == 90 || window.orientation == -90)) {
            // Full screen!
        } else {
            // Exit full screen!
        }
    });

关于javascript - iOS6 Safari 全屏检测，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/14910524/