Javascript请求全屏是不可靠的 [英] Javascript request fullscreen is unreliable

问题描述

我正在尝试使用JavaScript FullScreen API，从此处使用当前非标准实现的变通方法：

I'm trying to use the JavaScript FullScreen API, using workarounds for current non-standard implementations from here:

https://developer.mozilla.org/en/DOM/Using_full-screen_mode#AutoCompatibilityTable

可悲的是，它表现得非常不稳定。我只关心Chrome（使用v17），但由于我遇到问题，我在Firefox 10中进行了一些测试以进行比较，结果相似。

Sadly, it behaves very erratically. I only care about Chrome (using v17), but since I was having problems I did some tests in Firefox 10 for comparison, results are similar.

下面的代码试图将浏览器设置为全屏，有时它可以工作，有时不工作。它始终调用警报以指示它正在请求全屏。这是我发现的：

The code below attempts to set the browser to fullscreen, sometimes it works, sometimes not. It ALWAYS calls the alert to indicate it is requesting fullscreen. Here's what I've found:

• 它通常设置全屏。它可以进入停止工作的状态，但警报仍然会发生，即它仍在请求FullScreen，但它不起作用。


• 如果从按键调用它可以工作handler（document.onkeypress），但不是在页面加载（window.onload）上调用时。

我的代码如下：

function DoFullScreen() {

    var isInFullScreen = (document.fullScreenElement && document.fullScreenElement !==     null) ||    // alternative standard method  
            (document.mozFullScreen || document.webkitIsFullScreen);

    var docElm = document.documentElement;
    if (!isInFullScreen) {

        if (docElm.requestFullscreen) {
            docElm.requestFullscreen();
        }
        else if (docElm.mozRequestFullScreen) {
            docElm.mozRequestFullScreen();
            alert("Mozilla entering fullscreen!");
        }
        else if (docElm.webkitRequestFullScreen) {
            docElm.webkitRequestFullScreen();
            alert("Webkit entering fullscreen!");
        }
    }
}

推荐答案

requestFullscreen（）无法自动调用是出于安全原因（至少在Chrome中）。因此，它只能通过用户操作调用，例如：

requestFullscreen() can not be called automatically is because of security reasons (at least in Chrome). Therefore it can only be called by an user action such as:

• 点击（按钮，链接...）


• key（keydown，keypress ...）

如果您的文档包含在框架中：

And if your document is contained in a frame:

• allowfullscreen 需要出现在< iframe> 元素*

• allowfullscreen needs to be present on the <iframe> element*

* W3规格：

...为防止嵌入式内容全屏显示，只能通过HTML iframe 元素的 allowfullscreen 属性明确允许嵌入内容这将防止不受信任的内容全屏显示......

* W3 Spec:
"...To prevent embedded content from going fullscreen only embedded content specifically allowed via the allowfullscreen attribute of the HTML iframe element will be able to go fullscreen. This prevents untrusted content from going fullscreen..."

了解更多：全屏W3规格

还提到了 @abergmeier ，在Firefox上你的全屏请求在用户生成的事件被触发后，必须在1秒内执行 。

Also mentioned by @abergmeier, on Firefox your fullscreen request must be executed within 1 second after the user-generated event was fired.

这篇关于Javascript请求全屏是不可靠的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！