js 控制浏览器全屏案例

最新推荐文章于 2025-04-01 15:45:39 发布

王大强~

最新推荐文章于 2025-04-01 15:45:39 发布

阅读量647

点赞数

分类专栏： JavaScript-篇

本文链接：https://blog.youkuaiyun.com/angularWQ/article/details/78175512

版权

JavaScript-篇专栏收录该内容

46 篇文章

订阅专栏

<body>
<div οnclick="launchFullscreen(document.documentElement);"></div>
<div οnclick="exitFullscreen()(document.documentElement);"></div>
   <!--launchFullscreen(document.documentElement);
</body>
</html>
<script>
    // 判断各种浏览器，找到正确的方法
    function launchFullscreen(element) {
        if(element.requestFullscreen) {
            element.requestFullscreen();
        } else if(element.mozRequestFullScreen) {
            element.mozRequestFullScreen();
        } else if(element.webkitRequestFullscreen) {
            element.webkitRequestFullscreen();
        } else if(element.msRequestFullscreen) {
            element.msRequestFullscreen();
        }
    }

    // 判断浏览器种类
    function exitFullscreen() {
        if(document.exitFullscreen) {
            document.exitFullscreen();
        } else if(document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        } else if(document.webkitExitFullscreen) {
            document.webkitExitFullscreen();
        }
    }
    // 退出全屏模式!
    exitFullscreen();
</script>