js 实现全屏预览（F11功能）--转

2022-07-13 16:36:46 阅读：193 来源： 互联网

标签：el -- wscript clickBigNumber content 全屏 js cfs

参考文档 http://t.zoukankan.com/ghfjj-p-6322415.html

HTML代码

<body>
    <div id="content">
        <div>内容1</div>
        <div>内容2</div>
        <img id="btn" src="img/icon/btn_fd.png" 
             style="float:left;width:18px;height:18px"
             onclick="big()" />
    </div>
</body>

JS事件

<script type="text/javascript">
      var clickBigNumber = 1;//定义放大缩小点击次数
</script>

function big() {
    //由于只有一个按钮可操作，所以定义了clickBigNumber,
   //第一次点击，clickBigNumber==1，所以为全屏，再一次点击clickBigNumber==2且%2==0，所以退出全屏
    var content = document.getElementById('content');
    if (clickBigNumber % 2 == 0) {
        //退出全屏
        exitFullScreen(content);
    } else {
        //全屏
        fullScreen(content);
    }
    clickBigNumber++;
}

JS实现方法

//全屏
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}");
        }
    }
}

标签：el,--,wscript,clickBigNumber,content,全屏,js,cfs
来源： https://www.cnblogs.com/syeacfpl/p/16474306.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

js 实现全屏预览（F11功能）--转