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

待我称王封你为后i 2021-08-28 20:10 584阅读 0赞

js全屏与退出全屏

//全屏显式
            function showFull() { 
                var full = document.getElementById("mapContainer");
                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();
                } else if (document.msExitFullscreen) { 
                    document.msExitFullscreen();
                }
            }

> 参考：  
> https://www.jianshu.com/p/54729c73686a  
> https://www.cnblogs.com/s313139232/p/8371548.html  
> https://blog.csdn.net/ztsghjls/article/details/51788880

发表评论取消回复

表情：

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

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

相关阅读

相关 leaflet设置显示全屏和退出全屏功能（109）

![在这里插入图片描述][804c6d40d4d24c23bc0d621973afeef0.png_pic_center] 第109个 [点击查看专栏目录][Link 1]

红太狼/ 2024年03月26日 17:35/ 0 赞/ 84 阅读

相关 JavaScript require.js实现全屏和退出全屏效果

目录全屏和退出全屏浏览器全屏API 语法示例 API规格浏览器兼容性参阅 -------------------- 全屏和退出全屏引入

Love The Way You Lie/ 2023年06月06日 10:51/ 0 赞/ 16 阅读

相关 vue 全屏和退出全屏

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

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

相关 js实现一个全屏和退出全屏的功能

$(function(){ //全屏 function fullScreen(){ var el = doc

妖狐艹你老母/ 2022年09月10日 00:12/ 0 赞/ 272 阅读

相关 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 赞/ 378 阅读

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

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

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

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

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

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

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

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

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