Firefox等效于v33到chrome的视频:: - webkit-media-controls-fullscreen-button selector

时间:2014-12-12 14:42:29

标签: css html5 google-chrome firefox

标题几乎说明了一切。 我正在努力从默认的<video>皮肤中选择该死的全屏按钮。

1 个答案:

答案 0 :(得分:0)

我在http://www.jwplayer.com/blog/using-the-browsers-new-html5-fullscreen-capabilities/上找到了这个:

<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>

<img class="video_player" src="image.jpg" id="player"></img>
<button onclick="goFullscreen('player'); return false">Click Me To Go Fullscreen! (For real)</button>

我看到你可能正在寻找原生播放器的选择器,但这可以让你创建自己的按钮。