在最近的浏览器中将整个窗口设置为全屏

Setting the whole window to be fullscreen in recent browsers

本文关键字：设置 窗口 最近 浏览器      更新时间：2023-09-26

我想让用户点击一个链接，使用浏览器正在部署的RequestFullScreen功能，使我的网页完全全屏显示。你可以在这里看到这个页面。正如这里所建议的，我调用document.documentElement的requestFullScreen方法。代码如下：

var el = document.documentElement
    , rfs = el.requestFullScreen
         || el.webkitRequestFullScreen
         || el.mozRequestFullScreen
         || el.msRequestFullScreen
;
if(typeof rfs!="undefined" && rfs){
  rfs.call(el);
}

问题是，我在做这件事时得到了非常奇怪的工件，在我的情况下，背景大多是黑色的（如果你点击链接，你可以看到）。我做错什么了吗？在浏览器中手动设置全屏在我测试过的所有浏览器中都很好，这让我觉得documentElement在某种程度上不够包容。

换句话说：

CCD_ 1似乎没有做与用户手动设置全屏相同的事情。有什么区别？为什么这种差异会引起问题？

我已经检查了网站并感到困惑，代码似乎很好，但你可以尝试一下http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/

用这个函数完成了这项工作。

// Launch full screen
function launchFullscreen(element) {
  if(element.requestFullscreen) {
    element.requestFullscreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();
  }
}

全文

相关文章：