如何使用文档检测全屏.msFullscreenElement !== null (javascript)

How to detect fullscreen using document.msFullscreenElement !== null (with javascript)

本文关键字:null javascript msFullscreenElement 文档 何使用 检测      更新时间:2023-09-26

使用'document. 'msFullscreenElement !== null',根据这里给出的答案:

我试图检测页面是否在IE11全屏模式:

<!DOCTYPE html>
<head>
<title>Detect Fullscreen</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
var inFullscreen = document.msFullscreenElement !== null; 
alert("inFullscreen is " + inFullscreen);
</script>
</head>
<body>
<p>Detect Fullscreen in IE11</p>
</body>
</html>

但是,无论浏览器是否全屏,警报的结果都是false。大概是我误解了这句话的用法吧?

MSFullscreenChange事件在元素进入或退出全屏模式后触发,因此您可以获得当前状态。在这个例子中,我们检查msFullscreenElement来查看是否有元素全屏显示。如果一个元素处于全屏模式,则返回该元素,否则msFullscreenElement返回null。

if (document.requestFullscreen) {
  document.addEventListener("fullscreenchange", function () {
    if (document.fullscreenElement != null) {
      console.info("Went full screen");
    } else {
      console.info("Exited full screen");
    }
  });
}
else if (document.msRequestFullscreen) {
  document.addEventListener("MSFullscreenChange", function () {
    if (document.msFullscreenElement != null) {
      console.info("Went full screen");
    } else {
      console.info("Exited full screen");
    }
  });
}