Javascript Chrome 全屏 API
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7836204/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Chrome Fullscreen API
提问by Randomblue
According to this articleGoogle Chrome 15 has a fullscreen JavaScript API.
根据这篇文章Google Chrome 15 有一个全屏 JavaScript API。
I have tried to make it work but failed. I have also searched for official documentation in vain.
我试图让它工作但失败了。我也徒劳地搜索了官方文档。
What does the fullscreen JavaScript API look like?
全屏 JavaScript API 是什么样的?
回答by Eli Grey
The API only works during user interaction, so it cannot be used maliciously. Try the following code:
该 API 仅在用户交互期间起作用,因此不能被恶意使用。试试下面的代码:
addEventListener("click", function() {
var el = document.documentElement,
rfs = el.requestFullscreen
|| el.webkitRequestFullScreen
|| el.mozRequestFullScreen
|| el.msRequestFullscreen
;
rfs.call(el);
});
回答by Sindre Sorhus
I made a simple wrapper for the Fullscreen API, called screenfull.js, to smooth out the prefix mess and fix some inconsistencies in the different implementations. Check out the demoto see how the Fullscreen API works.
我为 Fullscreen API 制作了一个简单的包装器,称为screenfull.js,以消除前缀混乱并修复不同实现中的一些不一致。查看演示以了解 Fullscreen API 的工作原理。
Recommended reading:
推荐阅读:
回答by Drew Noakes
Here are some functions I created for working with fullscreen in the browser.
以下是我为在浏览器中使用全屏而创建的一些函数。
They provide both enter/exit fullscreen across most major browsers.
它们在大多数主要浏览器中都提供进入/退出全屏显示。
function isFullScreen()
{
return (document.fullScreenElement && document.fullScreenElement !== null)
|| document.mozFullScreen
|| document.webkitIsFullScreen;
}
function requestFullScreen(element)
{
if (element.requestFullscreen)
element.requestFullscreen();
else if (element.msRequestFullscreen)
element.msRequestFullscreen();
else if (element.mozRequestFullScreen)
element.mozRequestFullScreen();
else if (element.webkitRequestFullscreen)
element.webkitRequestFullscreen();
}
function exitFullScreen()
{
if (document.exitFullscreen)
document.exitFullscreen();
else if (document.msExitFullscreen)
document.msExitFullscreen();
else if (document.mozCancelFullScreen)
document.mozCancelFullScreen();
else if (document.webkitExitFullscreen)
document.webkitExitFullscreen();
}
function toggleFullScreen(element)
{
if (isFullScreen())
exitFullScreen();
else
requestFullScreen(element || document.documentElement);
}
回答by Mo Kargas
The following test works in Chrome 16 (dev branch) on X86 and Chrome 15 on Mac OSX Lion
以下测试适用于 X86 上的 Chrome 16(开发分支)和 Mac OSX Lion 上的 Chrome 15
回答by monjer
In Google's closure library project , there is a module which has do the job , below is the API and source code.
在谷歌的闭包库项目中,有一个模块可以完成这项工作,下面是 API 和源代码。
Closure library fullscreen.js API