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!
        }
    });

iOS6 Safari全屏检测

1 个答案: