Question

我正在使用Fullscreen API切换浏览器的全屏。它有效，但我有两个问题：

当我全屏显示时，如果我点击链接转到另一个页面（在我的域中），该页面将全屏显示。我想继续全屏模式。
在Chrome中，背景未填满整个屏幕高度。

使用F11键全屏时，不会出现这些问题。

这些问题有一些解决方案吗？其他一些API或解决方法？

我的javascript代码：

// toggle fullscren
function toggleFullScreen(element) {
    if (!document.fullscreenElement &&    // alternative standard method
        !document.mozFullScreenElement && !document.webkitFullscreenElement) {  // current working methods
        launchFullScreen(element);
    } else {
        cancelFullscreen();
    }
}

// Find the right method, call on correct element
function launchFullScreen(element) {
    if (element.requestFullScreen) {
        element.requestFullScreen();
    } else if (element.mozRequestFullScreen) {
        element.mozRequestFullScreen();
    } else if (element.webkitRequestFullScreen) {
        element.webkitRequestFullScreen();
    }
}

// Whack fullscreen
function cancelFullscreen() {
    if (document.cancelFullScreen) {
        document.cancelFullScreen();
    } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    } else if (document.webkitCancelFullScreen) {
        document.webkitCancelFullScreen();
    }
}

我的按钮切换全屏：

<a onclick="toggleFullScreen(document.documentElement);">
    <img src="~/Content/icons/fullscreen-launch-icon.svg" />
</a>

Answer 1

关于您的＃1问题，以下是Mozilla网站所说的内容：

此外，在全屏模式下，导航到其他页面，更改标签或切换到其他应用程序（例如，使用Alt-Tab）也会退出全屏模式。

这是一个链接： Using Full Screen Mode

以编程方式切换浏览器全屏

1 个答案: