requestFullScreen 全屏

最新推荐文章于 2025-06-06 09:05:36 发布

weixin_42390878

最新推荐文章于 2025-06-06 09:05:36 发布

阅读量2.3k

点赞数

CC 4.0 BY-SA版权

分类专栏： JS

本文链接：https://blog.youkuaiyun.com/weixin_42390878/article/details/85059148

JS 专栏收录该内容

14 篇文章

订阅专栏

这篇博客介绍了如何利用Hammer.js库响应手指双击事件，触发全屏显示的功能。需要注意的是，提供的全屏代码在苹果系统上可能无法正常工作。文章提供了相关参考链接以获取更多信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

手指双击全屏显示, 用Hammer.js 库

注：以下全屏代码不适用于苹果系统

其外参考代码：转自：https://my.oschina.net/itblog/blog/228654

function fullScreen() {
  var el = document.documentElement;
  var rfs = el.requestFullScreen || el.webkitRequestFullScreen || 
      el.mozRequestFullScreen || el.msRequestFullScreen;
  if(typeof rfs != "undefined" && rfs) {
    rfs.call(el);
  } else if(typeof window.ActiveXObject != "undefined") {
    //for IE，这里其实就是模拟了按下键盘的F11，使浏览器全屏
    var wscript = new ActiveXObject("WScript.Shell");
    if(wscript != null) {
        wscript.SendKeys("{F11}");
    }
  }
}
function exitFullScreen() {
  var el = document;
  var cfs = el.cancelFullScreen || el.webkitCancelFullScreen || 
      el.mozCancelFullScreen || el.exitFullScreen;
  if(typeof cfs != "undefined" && cfs) {
    cfs.call(el);
  } else if(typeof window.ActiveXObject != "undefined") {
    //for IE，这里和fullScreen相同，模拟按下F11键退出全屏
    var wscript = new ActiveXObject("WScript.Shell");
    if(wscript != null) {
        wscript.SendKeys("{F11}");
    }
  }
}

<html>
<head>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<div style="margin-top:50px"> <!-- 设置margin-top是为了查看IE全屏前后的区别 -->
  <input type="button" value="FullScreen" onclick="fullScreen()" />
  <input type="button" value="ExitFullScreen" onclick="exitFullScreen()" />
</div>
</body>
</html>