H5-全屏F11

最新推荐文章于 2024-05-02 17:16:34 发布

书山有路_邓

最新推荐文章于 2024-05-02 17:16:34 发布

阅读量271

点赞数

分类专栏： Html5 文章标签： h5

本文链接：https://blog.csdn.net/weixin_41497075/article/details/89083291

版权

Html5 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

H5-全屏F11

<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="UTF-8">
        <title>测试全屏</title>
</head>
<body>
    <button id='btn'>全屏按钮</button>  
<div id="content" style="background:#9bf;width:300px;height:200px;">
    <div id="quite" class="btn">退出全屏</div>  
</div>
    <script type="text/javascript">

    var btn = document.getElementById('btn');
    var content = document.getElementById('content');
    btn.onclick = function(){
        console.log(content);
        fullScreen(content);
    }
    var quite = document.getElementById('quite');
    quite.onclick = function(){
        exitFullScreen();
    }

    function fullScreen(el) {
        var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen,
            wscript;

        if(typeof rfs != "undefined" && rfs) {
            rfs.call(el);
            return;
        }

        if(typeof window.ActiveXObject != "undefined") {
            wscript = new ActiveXObject("WScript.Shell");
            if(wscript) {
                wscript.SendKeys("{F11}");
            }
        }
    }

    function exitFullScreen(el) {
        var el= document,
            cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.mozCancelFullScreen || el.exitFullScreen,
            wscript;

        if (typeof cfs != "undefined" && cfs) {
            cfs.call(el);
            return;
        }

        if (typeof window.ActiveXObject != "undefined") {
            wscript = new ActiveXObject("WScript.Shell");
            if (wscript != null) {
                wscript.SendKeys("{F11}");
            }
        }
    }
</script>
</body>
</html>

书山有路_邓

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
H5-全屏F11

H5-全屏代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>测试全屏</title></head><body> <button id='btn'>全屏按...
复制链接

扫一扫