7

我已经看过几十个这方面的教程，而且看起来很简单。我想要的只是让我的 HTML5 画布元素全屏显示（就像完全全屏一样，占据整个显示器）。

这是我的 HTML：

<p><canvas id="screen" width="800" height="500"
    style="background: #FFFFFF; border: 5px solid black;" role="img">
        Your browser does not support the canvas element.
</canvas></p>

<p><a href="javascript:goFullScreen();">Go Fullscreen</a></p>

这是我的 Javascript（在它自己的 .js 文件中）：

function goFullScreen(){
    var canvas = document.getElementById("screen");
    if(canvas.requestFullScreen)
        canvas.requestFullScreen();
    else if(canvas.webkitRequestFullScreen)
        canvas.webkitRequestFullScreen();
    else if(canvas.mozRequestFullScreen)
        canvas.mozRequestFullScreen();
}

我测试了功能；它被调用，三个 if 之一（即，因为我使用的是 Firefox，mozRequestFullScreen）被调用。我的浏览器在我测试过的每个演示中都会打开它，但不是在我自己的代码中。

缺少什么变量？我必须用谷歌搜索所有提到这一点的链接，但仍然一无所获。谢谢。

4

1 回答 1

10

Okay, I found the problem. This does not work:

<p><a href="javascript:goFullScreen();">Go Fullscreen</a></p>

This DOES work:

<p><button onclick="goFullScreen();">Go Fullscreen</button></p>

Yeah... 3 hours later.

于 2013-04-20T20:08:13.707 回答