iOS6 Safari全屏检测

Question

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

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

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

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

Answer 1

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

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

非全屏时文档高度约为 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!
        }
    });