iOS6 Safari全屏检测

Question

我希望在iOS6中使用Safari的新全屏功能。我知道无法从javascript触发全屏功能，也没关系，但我想知道用户何时进入全屏模式。(显示一个弹出窗口，其中包含文本“最好在全屏模式下查看此网站”，直到用户进入全屏模式为止。)

我尝试设置窗口、文档和‘wrapper’div（通过常规javascript和通过jQuery 'resize'事件）的onresize事件，并将其宽度和高度设置为100％，但是当我进入全屏模式时，它们并未触发。

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

是否有其他方法确定用户是否进入（或离开）全屏模式？

- Terrabythia

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

- Terrabythia