div的全屏与退出全屏

淡淡的烟草味﹌ 2022-03-28 12:48 309阅读 0赞

**html按钮：**

<button  onclick="showFull();">全屏</button>
    <button  onclick="delFull();">退出全屏</button>

**js调用：**

function showFull(){
        var full=document.getElementById("container");
        launchIntoFullscreen(full);
    }
    
    function delFull() {
         exitFullscreen();
    }

**全屏方法封装：**

function launchIntoFullscreen(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();
        }
    }

参考链接：[https://www.cnblogs.com/s313139232/p/8371548.html][https_www.cnblogs.com_s313139232_p_8371548.html]

参考链接：[http://blog.sina.com.cn/s/blog\_1458577430102xn4r.html][http_blog.sina.com.cn_s_blog_1458577430102xn4r.html]

[https_www.cnblogs.com_s313139232_p_8371548.html]: https://www.cnblogs.com/s313139232/p/8371548.html
[http_blog.sina.com.cn_s_blog_1458577430102xn4r.html]: http://blog.sina.com.cn/s/blog_1458577430102xn4r.html

发表评论取消回复

表情：

评论列表（有 0 条评论，309人围观）

还没有评论，来说两句吧...

相关阅读

相关 vue 全屏和退出全屏

html源码： <div id="allScreen" @click="showScreen" > <div >全屏内容 </div>

Dear 丶/ 2022年12月06日 15:48/ 0 赞/ 210 阅读

相关 Qt学习笔记17：控件全屏与退出全屏

举个栗子： void HMainWidget::onFullScreen(){ QWidget pSender = (QWidget

灰太狼/ 2022年09月03日 04:15/ 0 赞/ 136 阅读

相关应用程序动态全屏和退出全屏

原文: [http://chroya.iteye.com/blog/974031][http_chroya.iteye.com_blog_974031] 让程序全屏的方

红太狼/ 2022年06月09日 03:29/ 0 赞/ 237 阅读

相关 JavaScript控制全屏，监听退出全屏事件

> 本文转自：[https://www.cnblogs.com/yiven/p/7885528.html][https_www.cnblogs.com_yiven_p_7885

雨点打透心脏的1/2处/ 2022年05月19日 13:38/ 0 赞/ 1247 阅读

相关 QT中关于窗口全屏显示与退出全屏的实现

近期在学习QT时遇到了很多问题这也是其中一个，个人通过在各种书籍和网络上的查阅找到了一些关于这方面的答案，希望能给大家一些帮助。首先，在QT中对于窗口显示常用的有这么几个方

浅浅的花香味﹌/ 2022年04月25日 08:08/ 0 赞/ 569 阅读

相关 div的全屏与退出全屏

html按钮： <button onclick="showFull();">全屏</button> <button onclick="delFull();

淡淡的烟草味﹌/ 2022年03月28日 12:48/ 0 赞/ 310 阅读

相关原生js实现浏览器全屏和退出全屏

全屏模式 //W3C if (docElm.requestFullscreen) { docElm.requestFullscreen(

爱被打了一巴掌/ 2021年12月24日 19:41/ 0 赞/ 311 阅读

相关 HTML5--浏览器全屏操作、退出全屏、是否全屏

[HTML5--浏览器全屏操作、退出全屏、是否全屏][HTML5--] <!DOCTYPE html> <html lang="en"> <he

爱被打了一巴掌/ 2021年10月23日 14:12/ 0 赞/ 680 阅读

相关 JavaScript点击进入全屏和退出全屏

目录效果图核心代码完整案例效果图 ![点击进入全屏][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow

向右看齐/ 2021年09月22日 01:01/ 0 赞/ 437 阅读

相关 JavaScript实现全屏与退出全屏功能

js全屏与退出全屏 //全屏显式 function showFull() { var full = docu

待我称王封你为后i/ 2021年08月28日 20:10/ 0 赞/ 483 阅读