是否可以创建全屏 HTML 弹出窗口，例如全屏视频播放器？

Question

我想创建一个与全屏视频播放器类似的体验，它在浏览器之外扩展到整个显示器的高度和宽度，但基于 HTML（即我可以放入背景和按钮并使用 CSS将其呈现给用户）。

这可能吗？我在考虑 HTML/CSS/Javascript，但对任何技术都开放。

Answer 1

要使用 JS 制作全屏内容，您必须使用 requestFullscreen() 方法。

来自this article：

/* Get the element you want displayed in fullscreen mode (a video in this example): */
var elem = document.getElementById("myvideo");

/* When the openFullscreen() function is executed, open the video in fullscreen.
Note that we must include prefixes for different browsers, as they don't support the requestFullscreen property yet */
function openFullscreen() {
  if (elem.requestFullscreen) {
    elem.requestFullscreen();
  } else if (elem.mozRequestFullScreen) { /* Firefox */
    elem.mozRequestFullScreen();
  } else if (elem.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
    elem.webkitRequestFullscreen();
  } else if (elem.msRequestFullscreen) { /* IE/Edge */
    elem.msRequestFullscreen();
  }
}