如何以全屏模式自动打开网页

Posted 2023-05-07

【中文标题】如何以全屏模式自动打开网页

【英文标题】：How to open a web page automatically in full screen mode

【发布时间】：2013-10-21 17:33:15

【问题描述】：

如何在全屏模式下自动打开网页？

我正在寻找一种在全屏模式下自动打开网页的解决方案，而无需用户按 F11 或任何其他浏览器特定键。

我已经搜索了很多，但我找不到解决方案。

是否有脚本、库或浏览器特定的 API 可以帮助我实现这一目标？

【问题讨论】：

Is there a way to make html5 video fullscreen? 的可能副本。即使问题本身与该问题不重复，但接受的答案也将在这里匹配。无论如何，看看HTML5 fullscreen API

发现了一个类似的问题 [***.com/questions/7495373/…

Switch window between normal and full-screen mode 的可能副本

在没有用户交互（点击按钮等）的情况下无法全屏打开页面，因为这会非常烦人。

github.com/kayahr/jquery-fullscreen-plugin 适用于基于 Webkit 的浏览器（如 Chrome 和 Safari）、Firefox 和 IE11+ 等

【参考方案1】：

通过Chrome Fullscreen APIChrome

请注意，出于 (Chrome) 安全原因，它不能自动调用或执行，必须先有来自用户的交互。 （如按钮点击、keydown/keypress 等）

addEventListener("click", function() 
    var
          el = document.documentElement
        , rfs =
               el.requestFullScreen
            || el.webkitRequestFullScreen
            || el.mozRequestFullScreen
    ;
    rfs.call(el);
);

javascript Fullscreen API as demo'd by David Walsh 这似乎是一个跨浏览器解决方案

// Find the right method, call on correct element
function launchFullScreen(element) 
  if(element.requestFullScreen) 
    element.requestFullScreen();
   else if(element.mozRequestFullScreen) 
    element.mozRequestFullScreen();
   else if(element.webkitRequestFullScreen) 
    element.webkitRequestFullScreen();
  


// Launch fullscreen for browsers that support it!
launchFullScreen(document.documentElement); // the whole page
launchFullScreen(document.getElementById("videoElement")); // any individual element

【参考方案2】：

仅适用于 IE：

window.open ("mapage.html","","fullscreen=yes");  
window.open('','_parent','');  
window.close();

【参考方案3】：

最好自己尝试模拟一个网络浏览器。你不必拘泥于Chrome或IE之类的东西。

如果你使用 Python，你可以试试 pyQt4 包，它可以帮助你模拟一个网络浏览器。 这样做不会有任何安全原因，您可以将网络浏览器设置为自动以全屏模式显示。

【参考方案4】：

您可以通过输入以下代码自动进入全屏：

var elem = document.documentElement; if (elem.requestFullscreen)  elem.requestFullscreen() 

演示：https://codepen.io/ConfidentCoding/pen/ewLyPX

注意：出于安全原因，并不总是有效。但它至少对我有用。检查和粘贴代码时不起作用。

【讨论】：

除了“并不总是有效”之外，您可能应该提供更多信息。什么时候不起作用？为什么？

【参考方案5】：

查看完整尺寸的页面 （功能 （） var viewFullScreen = document.getElementById("view-fullscreen"); 如果（viewFullScreen） viewFullScreen.addEventListener("点击", function () var docElm = document.documentElement; 如果（docElm.requestFullscreen） docElm.requestFullscreen(); 否则如果（docElm.mozRequestFullScreen） docElm.mozRequestFullScreen(); 否则如果（docElm.webkitRequestFullScreen） docElm.webkitRequestFullScreen(); ， 错误的）; )();

<div class="container">      
            <section class="main-content">
                                    <center><a href="#"><button id="view-fullscreen">view full size page large</button></a><center>
                                           <script>(function () 
    var viewFullScreen = document.getElementById("view-fullscreen");
    if (viewFullScreen) 
        viewFullScreen.addEventListener("click", function () 
            var docElm = document.documentElement;
            if (docElm.requestFullscreen) 
                docElm.requestFullscreen();
            
            else if (docElm.mozRequestFullScreen) 
                docElm.mozRequestFullScreen();
            
            else if (docElm.webkitRequestFullScreen) 
                docElm.webkitRequestFullScreen();
            
        , false);
    
    )();</script>
                                           </section>
</div>

在此处查看演示 clcik demo of click to open page in fullscreen

【参考方案6】：

window.onload = function() 
    var el = document.documentElement,
        rfs = el.requestFullScreen
        || el.webkitRequestFullScreen
        || el.mozRequestFullScreen;
    rfs.call(el);
;

【讨论】：

我怀疑这会有所帮助，甚至根本没有用。为了说服我，请解释一下你的意思是如何工作和解决问题。