3

可能重复：
检测浏览器是否处于全屏模式

当 Chrome 或 FF 全屏显示时，我正在开发一个在 Mac OSX 上无法正常运行的功能。当它们刚刚最大化时，它工作正常。当（且仅当）它们处于全屏状态时，我想将这些浏览器排除在此功能之外。我很难找到一种方法来检测这一点。有没有人有经验或指点？

4

4 回答 4

4

我认为您可以检查是否fullscreenElement为“非空”。不幸的是，它们在不同的浏览器中都有不同的命名，因此您需要执行以下操作：

if ( document.mozFullScreenElement || 
     document.webkitCurrentFullScreenElement ||
     document.fullscreenElement ) { console.log('FULLSCREEN!'); }

文档（mozilla）：https ://developer.mozilla.org/en-US/docs/DOM/document.mozFullScreenElement

您还可以附加事件处理程序以手动跟踪全屏状态：

document.addEventListener( 'fullscreenchange', handler, false );
document.addEventListener( 'mozfullscreenchange', handler, false );
document.addEventListener( 'webkitfullscreenchange', handler, false );

function handler() {
    // fullscreen mode changed
}
于 2012-10-29T17:47:55.960 回答
1

您可以检查视口的尺寸。如果它与常见的屏幕尺寸相匹配1024x768，1920x1080则您可能处于全屏模式。

于 2012-10-29T17:31:42.027 回答
1

您可以尝试以下代码：

if (screen.width == window.innerWidth && screen.height == window.innerHeight) {
    //full web browser
}
于 2012-10-29T17:32:35.737 回答
1

您可以查看一些属性来解决这个问题，但我强烈建议您进行测试，因为我发现它们在 FF、Chrome 和 IE 中报告的值有些奇怪，尤其是在双显示器设置的情况下。

screen.avalHeight并screen.availWidth给出屏幕分辨率，同时 window.outerHeight给出window.outerWidth窗口大小。

只需检查它们是否匹配。

于 2012-10-29T17:40:22.650 回答