JS 实现全屏预览 F11功能

miguel.jiang 发布于2019-08-30 15:54 / 1228人阅读

摘要：按进入全屏模式全屏查看按关闭全屏模式全屏关闭记得一定要加上调用代码，调用代码，调用代码，说三遍调用代码只做个人备忘，不做任何发表，不做信息交流。尽管拿去用，不谢

老是不通过，没办法，只能是重新发布了，反正我就是杠上了，大大小小写过很多前端特效，当然也经常在网上copy或者修改人家的代码，我觉得也挺好的，为什么？！因为我想这样，你能怎么办，打我？
少废话，直接上代码，
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}");
        }
  }
}

HTML代码
最近受了一点点小刺激，对自己做的工作产生迷茫，不知道还要做这个做多久，还有我其实还是喜欢设计多一些，还有我喜欢设计，但是设计太难了，经常觉得自己做的东西跟别人的，比起来差个好几万块钱，Why?你问我，我问谁。好吧，我也很无赖。
举个小小例子，随便来一个按钮试试，按钮上在来个点击事件切换。

记得一定要加上调用代码，调用代码，调用代码，说三遍...
JS调用代码

var oBtnFullOpen = document.getElementById("BtnFullOpen");
var oContent = document.getElementById("Content");
oBtnFullOpen.onclick = function() {
    fullScreen(oContent);
    oBtnFullQuite.setAttribute("style", "display:block");
    oBtnFullOpen.setAttribute("style", "display:none");
}
var oBtnFullQuite = document.getElementById("BtnFullQuite");
oBtnFullQuite.onclick = function() {
    exitFullScreen(oContent);
    oBtnFullQuite.setAttribute("style", "display:none");
    oBtnFullOpen.setAttribute("style", "display:block");
};

只做个人备忘，不做任何发表，不做信息交流。
尽管拿去用，不谢！

云服务器 GPU云服务器 js 模拟f11全屏 js实现f11的效果 js实现在线文档预览 js实现浏览器全屏

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/116939.html

JS 实现全屏预览 F11功能

摘要：按进入全屏模式全屏查看按关闭全屏模式全屏关闭记得一定要加上调用代码，调用代码，调用代码，说三遍调用代码只做个人备忘，不做任何发表，不做信息交流。尽管拿去用，不谢老是不通过，没办法，只能是重新发布了，反正我就是杠上了，大大小小写过很多前端特效，当然也经常在网上copy或者修改人家的代码，我觉得也挺好的，为什么？！因为我想这样，你能怎么办，打我？少废话，直接上代码，JS代码 functi...

gggggggbong 2019-07-01 10:21 评论0 收藏0
JS 实现全屏预览 F11功能

摘要：按进入全屏模式全屏查看按关闭全屏模式全屏关闭记得一定要加上调用代码，调用代码，调用代码，说三遍调用代码只做个人备忘，不做任何发表，不做信息交流。尽管拿去用，不谢老是不通过，没办法，只能是重新发布了，反正我就是杠上了，大大小小写过很多前端特效，当然也经常在网上copy或者修改人家的代码，我觉得也挺好的，为什么？！因为我想这样，你能怎么办，打我？少废话，直接上代码，JS代码 functi...

bbbbbb 2019-08-02 10:59 评论0 收藏0
jquery全屏及退出全屏

摘要：涉及方法请求全屏退出全屏取消全屏监听全屏变化全屏全屏退出全屏通过事件监听退出全屏也可通过来监控全屏变化涉及方法： requestFullScreen：请求全屏 exitFullscreen：退出全屏 cancelFullScreen：取消全屏 fullscreenchange：监听全屏变化 html showImg(https://segmentfault.com/im...

Astrian 2019-08-23 14:58 评论0 收藏0
js控制全屏显示/退出全屏的方法

摘要：退出全屏全屏显示大家可以微信添加订阅号冷星学前端，同步更新文章内容退出全屏 var exitFullScreen = function() { var e = document; e.exitFullscreen ? e.exitFullscreen() : e.mozCancelFullScreen ? e.mozCancelFullScreen() : e.web...

tainzhi 2019-08-20 15:47 评论0 收藏0