在移动浏览器的HTML5视频全屏播放（Android版） [英] HTML5 video full screen on mobile browsers (android)

问题描述

一个巨大的研究后，我没有发现任何回答我的问题呢。我想实现我的是 FullScreenAPI ，但它不以任何移动浏览器支持的目标（除了火狐19和BlackBerry浏览器 - 但是我需要一个跨浏览器解决方案）。 这里的源。我还测试的 FullScreenAPI 在原生Android浏览器和移动浏览器与适当的prefixed全屏功能。每个函数的类型未定义的。

After a huge research I didn't find any answer to my question yet. I wanted to achieve my goal with FullScreenAPI but it is not supported in any mobile browser (except Firefox 19 and Blackberry browser - but I need a cross-browser solution). Here's the source. I also tested FullScreenAPI on native android browser and mobile Chrome with appropriately prefixed fullscreen functions. Each function was of type undefined.

另一种方法是在 RTSP协议这通常是由外球员处理。 这里是谁假定m.youtube.com使用该解决方案的家伙 - 我认为这是不正确的（也许答案已经过时）。 YouTube使用本机视频的全屏。在当你点击播放按钮移动浏览器，电影瞬间变为全屏。

Another approach was the rtsp protocol which is usually handled by an outer player. Here is the guy who assumes that m.youtube.com uses that solution - I think it is not true (maybe the answer is outdated). Youtube uses native video's fullscreen. On mobile Chrome when you tap the play button, the movie instantly goes fullscreen.

虽然，每次我的源一派的告诉我，本地全屏不可能在Android浏览器，仍然以其本地控件的 HTML5视频元素给了我们一个全屏按钮，它的工作原理完美在那里。

Although, every source I googled tells me that native fullscreen is not possible on android browsers, still HTML5 video element with its native controls gives us a fullscreen button which works perfectly out there.

由于我不想要本机的控制，任何人都可以分享任何巧妙的解决如何触发HTML5视频的全屏按钮的 事件

Since I don't want the native controls, can anyone share any ingenious solution to How to trigger HTML5 video fullscreen button'sevent?

推荐答案

下面是我使用的应该处处pretty很多工作：

Here's what I use that should pretty much work everywhere:

function toggleFullScreen() {
  var doc = window.document;
  var elem = doc.body; //the element you want to make fullscreen

  var requestFullScreen = elem.requestFullscreen || elem.webkitRequestFullScreen || elem.mozRequestFullScreen || elem.msRequestFullscreen;
  var cancelFullScreen = doc.exitFullscreen || doc.webkitExitFullscreen || doc.mozCancelFullScreen|| doc.msExitFullscreen;

  if(!(doc.fullscreenElement || doc.mozFullScreenElement || doc.webkitFullscreenElement || doc.msFullscreenElement)) {
      requestFullScreen.call(doc.body);
  }
  else {
    cancelFullScreen.call(doc);
  }
}

这篇关于在移动浏览器的HTML5视频全屏播放（Android版）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！