网页全屏缩放代码

最新推荐文章于 2024-08-14 19:32:44 发布

zLinks

最新推荐文章于 2024-08-14 19:32:44 发布

阅读量1.2k

点赞数 1

分类专栏： Vue Web前端文章标签：网页样式

本文链接：https://blog.csdn.net/qq_43251032/article/details/102820346

版权

Vue 同时被 2 个专栏收录

5 篇文章 2 订阅

订阅专栏

Web前端

4 篇文章 0 订阅

订阅专栏

定义一个点击事件，方法体中加入以下代码即可实现，Vue、html都可使用

if (!document.fullscreenElement &&
                !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) {  // current working methods
                if (document.documentElement.requestFullscreen) {
                    document.documentElement.requestFullscreen();
                } else if (document.documentElement.msRequestFullscreen) {
                    document.documentElement.msRequestFullscreen();
                } else if (document.documentElement.mozRequestFullScreen) {
                    document.documentElement.mozRequestFullScreen();
                } else if (document.documentElement.webkitRequestFullscreen) {
                    document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
                }
            } else {
                if (document.exitFullscreen) {
                    document.exitFullscreen();
                } else if (document.msExitFullscreen) {
                    document.msExitFullscreen();
                } else if (document.mozCancelFullScreen) {
                    document.mozCancelFullScreen();
                } else if (document.webkitExitFullscreen) {
                    document.webkitExitFullscreen();
                }
            }