javascript - 在 Mac OS X 上自动全屏打开 Chrome

Question

最近我在以色列网站上偶然发现了一个新品牌的弹出窗口。单击文章并打开弹出窗口后，浏览器将进入全屏模式。他们是如何做到这一点的？

你可以重现这个:

1. 在 Mac OS X 上使用 Chrome

2. 转到此页面:http://www.haaretz.co.il/news/politi/.premium-1.2145182

3. 单击文章文本一次或两次，直到弹出窗口打开。

谢谢，

Answer 1

可以使用 HTML5 全屏 API 将浏览器窗口设置为全屏。我不确定您提到的网站是否正在使用这种方法。

这还不是标准，因此需要 vendor 前缀。您可以在 CANIUSE 查看浏览器支持级别HTML5 Rocks 有一个简短的教程 Fullscreen API.

编辑:用代码更新答案。

正如我所怀疑的，该网站使用了 HTML5 全屏 API。引用页面which_popup.php

下面的代码

function popup_(url, isOnClick) {

var is_popup_activated_domain = getCookieA('haaretz');
if (is_popup_activated_domain == "" && the_cookie == "") {
    if (isOnClick) {
        setCookieA('haaretz', 'yes', 14400);
        the_cookie = 'yes';
    }

    var chrome_full = false;
    if (document.documentElement.webkitRequestFullscreen) {
        document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
        chrome_full = true;
    }

    //....
    if (chrome_full) {
        document.webkitCancelFullScreen();
    }
}
}

它基本上是监听一个点击文本的事件，将浏览器设置为全屏然后打开弹窗，所以弹窗也进入全屏。您需要的 API 方法是用于启用全屏模式的 webkitRequestFullscreen 和用于退出全屏模式的 webkitCancelFullScreen。