onclick全屏

Question

我正在为即将推出的Chrome网上商店创建一个网络应用.有没有办法模拟F11被按下？或者只是一个命令,使当前窗口全屏显示？

Answer 1

我意识到这是一个非常古老的问题,并且所提供的答案是充分的,因为它是活跃的,我通过对全屏进行一些研究来发现这一点,我在这里留下一个更新:

有一种方法来"模拟"的F11键,但不能自动的,用户实际需要点击例如按钮,以触发全屏模式.

• 在按钮单击时切换全屏状态

  在此示例中,用户可以通过单击按钮切换到全屏模式:

  用作触发器的HTML元素:

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

  JavaScript的:

  function toggleFullScreen() {
    if ((document.fullScreenElement && document.fullScreenElement !== null) ||    
     (!document.mozFullScreen && !document.webkitIsFullScreen)) {
      if (document.documentElement.requestFullScreen) {  
        document.documentElement.requestFullScreen();  
      } else if (document.documentElement.mozRequestFullScreen) {  
        document.documentElement.mozRequestFullScreen();  
      } else if (document.documentElement.webkitRequestFullScreen) {  
        document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);  
      }  
    } else {  
      if (document.cancelFullScreen) {  
        document.cancelFullScreen();  
      } else if (document.mozCancelFullScreen) {  
        document.mozCancelFullScreen();  
      } else if (document.webkitCancelFullScreen) {  
        document.webkitCancelFullScreen();  
      }  
    }  
  }
  

• 单击按钮转到全屏

  此示例允许您启用全屏模式而不进行更改,即您切换到全屏但返回正常屏幕将必须使用F11键:

  用作触发器的HTML元素:

  <input type="button" value="click to go fullscreen" onclick="requestFullScreen()">
  

  JavaScript的:

  function requestFullScreen() {
  
    var el = document.body;
  
    // Supports most browsers and their versions.
    var requestMethod = el.requestFullScreen || el.webkitRequestFullScreen 
    || el.mozRequestFullScreen || el.msRequestFullScreen;
  
    if (requestMethod) {
  
      // Native full screen.
      requestMethod.call(el);
  
    } else if (typeof window.ActiveXObject !== "undefined") {
  
      // Older IE.
      var wscript = new ActiveXObject("WScript.Shell");
  
      if (wscript !== null) {
        wscript.SendKeys("{F11}");
      }
    }
  }
  

找到的来源以及有关此主题的有用信息:

Mozilla开发者网络

如何在Javascript全屏窗口中制作(在屏幕上伸展)

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

Chrome全屏API

jQuery全屏事件插件,版本0.2.0

jQuery的全屏,插件

Answer 2

它可以用JavaScript.

var elem = document.getElementById("myvideo");
if (elem.requestFullscreen) {
  elem.requestFullscreen();
} else if (elem.msRequestFullscreen) {
  elem.msRequestFullscreen();
} else if (elem.mozRequestFullScreen) {
  elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
  elem.webkitRequestFullscreen();
}

Answer 3

简短的个人书签版本

javascript: document.body.webkitRequestFullScreen(); 

去全屏？您可以将此链接拖到书签栏以创建书签，但之后必须编辑其 URL：删除之前的所有内容javascript，包括单斜杠：[...]http://delete_me/javascript:

这在 Google Chrome 中对我有用。您必须测试它是否在您的环境中工作，否则使用函数调用的不同措辞，例如javascript:document.body.requestFullScreen();- 请参阅其他答案以了解可能的变体。

_{基于@Zuul 和@default 的回答——谢谢！}

Answer 4

如果您想将整个选项卡切换到全屏（就像 F11 按键）document.documentElement是您正在寻找的元素：

function go_full_screen(){
    var elem = document.documentElement;
    if (elem.requestFullscreen) {
      elem.requestFullscreen();
    } else if (elem.msRequestFullscreen) {
      elem.msRequestFullscreen();
    } else if (elem.mozRequestFullScreen) {
      elem.mozRequestFullScreen();
    } else if (elem.webkitRequestFullscreen) {
      elem.webkitRequestFullscreen();
    }
}