javascript webkitRequestFullScreen 不起作用?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/28474288/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 09:02:09  来源:igfitidea点击:

webkitRequestFullScreen not working?

javascript

提问by Prime By Design

I have this JSFiddle sample for webkitRequestFullScreen.

我有这个用于 webkitRequestFullScreen 的 JSFiddle 示例。

I'm using Chrome 2 on Mac OSX and the example does not appear to work for me. Initially I wrote my own example but the one in the link below is not written by me. Still it doesn't appear to work.

我在 Mac OSX 上使用 Chrome 2,但该示例似乎对我不起作用。最初我写了自己的例子,但下面链接中的那个不是我写的。仍然它似乎不起作用。

http://jsfiddle.net/2uNzk/1/

http://jsfiddle.net/2uNzk/1/

var test = document.querySelector('.test');

test.addEventListener('click', function () {

  if(test.requestFullScreen) {
    test.requestFullScreen();
  } else if(test.mozRequestFullScreen) {
    test.mozRequestFullScreen();
  } else if(test.webkitRequestFullScreen) {
    test.webkitRequestFullScreen();
  }
}, false);

however the following example does work! Only when I try to reproduce it in Plunker or JSFiddle it doesn't appear to work:

但是下面的例子确实有效!只有当我尝试在 Plunker 或 JSFiddle 中重现它时,它似乎不起作用:

http://www.jwplayer.com/blog/using-the-browsers-new-html5-fullscreen-capabilities/

http://www.jwplayer.com/blog/using-the-browsers-new-html5-fullscreen-capabilities/

heres my plunker example:

这是我的 plunker 示例:

 <!-- just to keep things in one place I put the JS here. -->
  <script type="text/javascript">
    function goFullscreen(id) {

      // Get the element that we want to take into fullscreen mode
      var element = document.getElementById(id);

      // These function will not exist in the browsers that don't support fullscreen mode yet, 
      // so we'll have to check to see if they're available before calling them.

      if (element.mozRequestFullScreen) {
        // This is how to go into fullscren mode in Firefox
        // Note the "moz" prefix, which is short for Mozilla.
        element.mozRequestFullScreen();
      } else if (element.webkitRequestFullScreen) {

        // This is how to go into fullscreen mode in Chrome and Safari
        // Both of those browsers are based on the Webkit project, hence the same prefix.
        element.webkitRequestFullScreen();

      }
      // Hooray, now we're in fullscreen mode!
    }
  </script>



  <div class="example">
    <img class="video_player" src="http://assets3.parliament.uk/iv/main-large//ImageVault/Images/id_7382/scope_0/ImageVaultHandler.aspx.jpg" id="player2">
    <button onclick="goFullscreen('player2'); return false">Click Me To Go Fullscreen! (For real)</button>
  </div>

http://plnkr.co/edit/BOhqNTEACTPmr9ebVnHs?p=preview

http://plnkr.co/edit/BOhqNTEACTPmr9ebVnHs?p=preview

Any ideas? I'm baffled!

有任何想法吗?我很困惑!

回答by

The webkit version does not capitalize the sof Fullscreen.

WebKit的版本不大写sFullscreen