如何通过JavaScript使用F11键事件使浏览器全屏显示

时间:2011-09-21 06:22:26

标签: javascript browser screen fullscreen keyevent

我想让我的浏览器全屏显示。和我们做F11关键事件时一样。我找到了一些例子,如

function maxwin() {
    var wscript = new ActiveXObject("WScript.Shell");
    if (wscript!=null) {
         wscript.SendKeys("{F11}");
    }
}

哪些不适用于Mozilla或任何其他最新浏览器。如果有任何方法可以解决这个问题,请告诉我。

感谢。 (提前。)

4 个答案:

答案 0 :(得分:10)

使用此代码

var el = document.documentElement
, rfs = // for newer Webkit and Firefox
       el.requestFullScreen
    || el.webkitRequestFullScreen
    || el.mozRequestFullScreen
    || el.msRequestFullScreen
;
if(typeof rfs!="undefined" && rfs){
  rfs.call(el);
} else if(typeof window.ActiveXObject!="undefined"){
  // for Internet Explorer
  var wscript = new ActiveXObject("WScript.Shell");
  if (wscript!=null) {
     wscript.SendKeys("{F11}");
  }
}

来源:How to make in Javascript full screen windows (stretching all over the screen)

在Chrome,FF10以上,IE 8以上,Safari 5 ..上工作和测试。

答案 1 :(得分:10)

现在可以在最新版本的Chrome,Firefox和IE(11)中使用。

根据Zuul在this thread上的指示,我编辑了他的代码以包含IE11以及全屏选择页面上任何元素的选项。

JS:

function toggleFullScreen(elem) {
    // ## The below if statement seems to work better ## if ((document.fullScreenElement && document.fullScreenElement !== null) || (document.msfullscreenElement && document.msfullscreenElement !== null) || (!document.mozFullScreen && !document.webkitIsFullScreen)) {
    if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) || (document.msFullscreenElement !== undefined && document.msFullscreenElement === null) || (document.mozFullScreen !== undefined && !document.mozFullScreen) || (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) {
        if (elem.requestFullScreen) {
            elem.requestFullScreen();
        } else if (elem.mozRequestFullScreen) {
            elem.mozRequestFullScreen();
        } else if (elem.webkitRequestFullScreen) {
            elem.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
        } else if (elem.msRequestFullscreen) {
            elem.msRequestFullscreen();
        }
    } else {
        if (document.cancelFullScreen) {
            document.cancelFullScreen();
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        } else if (document.webkitCancelFullScreen) {
            document.webkitCancelFullScreen();
        } else if (document.msExitFullscreen) {
            document.msExitFullscreen();
        }
    }
}

HTML:

<input type="button" value="click to toggle fullscreen" onclick="toggleFullScreen(document.body)">

where&#34; document.body&#34;是你想要的任何元素。

另请注意,尝试从控制台运行这些全屏命令似乎无法在Chrome或IE上运行。我确实在Firefox中使用Firebug取得了成功。

另外需要注意的是,这些&#34;全屏&#34;命令没有垂直滚动条,您需要在CSS中指定:

*:fullscreen
*:-ms-fullscreen,
*:-webkit-full-screen,
*:-moz-full-screen {
   overflow: auto !important;
}

&#34;!important&#34;似乎是IE渲染它所必需的

答案 2 :(得分:6)

如果没有本机代码或浏览器扩展名,则无法使用。 ActiveXObject仅存在于IE浏览器中。

答案 3 :(得分:-2)

现在有可能(至少在safari 5上的webkit浏览器,chrome 16)和

 webkitEnterFullscreen()

Firefox 10也可以使用。 check this link

不知道i-e在本主题中做了什么