如何以编程方式在PWA中将显示从独立显示切换为全屏显示

时间:2018-10-29 15:07:01

标签: javascript progressive-web-apps

当我将清单的“显示”设置为“全屏”或“独立”时,我的PWA可以正常工作。但是,我希望我的用户能够在设置中来回切换。有没有办法在JavaScript中以编程方式对此进行切换?

2 个答案:

答案 0 :(得分:0)

使用document.body.requestFullscreen();

var videoElement = document.getElementById("videoElement");
videoElement.requestFullscreen();

选中https://developers.google.com/web/fundamentals/native-hardware/fullscreen/

答案 1 :(得分:0)

如果要确保它可以在所有浏览器中使用,请尝试此操作。

function getFullScreen() {
    if (document.body.requestFullscreen) {
        document.body.requestFullscreen();
    } else if (document.body.mozRequestFullScreen) { /* Firefox */
        document.body.mozRequestFullScreen();
    } else if (document.body.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
        document.body.webkitRequestFullscreen();
    } else if (document.body.msRequestFullscreen) { /* IE/Edge */
        document.body.msRequestFullscreen();
    }
}