1

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

您可以使用以下方法重现此内容：

  1. 在 Mac OS X 上使用 Chrome

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

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

谢谢，

4

2 回答 2

2

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

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

编辑：用代码更新答案。

正如我所怀疑的，该网站使用 HTML5 Fullscreen 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退出全屏模式。

于 2013-10-21T04:15:33.657 回答
0

此链接可能对您有帮助..

http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/

// mozilla proposal
element.requestFullScreen();
document.cancelFullScreen(); 

// Webkit (works in Safari and Chrome Canary)
element.webkitRequestFullScreen(); 
document.webkitCancelFullScreen(); 

// Firefox (works in nightly)
element.mozRequestFullScreen();
document.mozCancelFullScreen(); 

// W3C Proposal
element.requestFullscreen();
document.exitFullscreen();

也试试这些..

void webkitRequestFullScreen();
void webkitRequestFullScreenWithKeys();
void webkitCancelFullScreen();

Chrome 在 4.0.245.0 版本中实现了“Kiosk 模式”。这本质上是一种在禁用地址栏和状态栏的情况下以全屏模式启动浏览器的方法。某些键盘快捷键（例如全屏）也被禁用。

在 Windows 上：chrome.exe -kiosk http://yoursite.com/file.html

其他一切：chromium-browser --kiosk http://yoursite.com/file.html

于 2013-10-25T04:18:40.027 回答