div的全屏与退出全屏

淡淡的烟草味﹌ 2022-03-28 12:48 380阅读 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 条评论，380人围观）

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

相关阅读

相关 SecureCRT退出全屏

使用快捷键ALT+ENTER退出全屏（快捷键ALT+ENTER作用：进入全屏、退出全屏） ![退出全屏][70] [70]: https://img-blog.cs

迷南。/ 2023年10月17日 20:14/ 0 赞/ 22 阅读

相关 vue 全屏和退出全屏

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

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

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

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

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

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

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

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

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

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

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

相关 div的全屏与退出全屏

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

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

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

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

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

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

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

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

相关 HTML5 video 进入全屏和退出全屏

当我们使用video标签的时候，有时候因为更多的需要，我们要自己自定义控制栏，而进入和退出全屏也是其中的一部分不同的浏览器有不同的实现方法 // Webki

àì夳堔傛蜴生んèń/ 2021年09月18日 15:38/ 0 赞/ 657 阅读

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

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

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