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

Question

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

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

Answer 1

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

/* 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();
  }
}

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

Is it possible to create a full screen HTML popup, like a full screen video player?

javascript

html

css

fullscreen