javascript-在iPad和Android平板电脑上强制全屏HTML5视频播放?

我有一个简单的视频标签

<video id="video-1" poster="img/video/poster-1.jpg" preload="none">
  <source src="http://player.vimeo.com/external/the_video-id" type="video/mp4">
</video>

我通过javascript按钮播放

$('[data-play-video]').click(function(){
  var video_id = $(this).data('playVideo');
  var video_control = $(video_id)[0];
  video_control.play();
});

该视频可以在桌面和iPhone的全屏播放器中内联播放.在iPad上,它可以内联播放,但我希望它在认的iOS视频播放器中以iPhone一样的全屏播放.我该如何实现?

我知道webkit-playsinline属性可用于强制视频在iPhone上内联播放. (HTML5 inline video on iPhone vs iPad/Browser)和(Can I avoid the native fullscreen video player with HTML5 on iPhone or android?)

但是,我要相反:在所有iOS和Android设备上以认的iPhone全屏格式播放视频.

解决方法:

您可以使用webkitEnterFullscreen()方法.

    var vid;

    function init() {

        vid = document.getElementById("myVideo");

        vid.addEventListener("loadedMetadata", addFullscreenButton, false);

    }

    function addFullscreenButton() {

        if (vid.webkitSupportsFullscreen) {

            var fs = document.getElementById("fs");

            fs.style.visibility = "visible";

        }

    }

    function goFullscreen() {

        vid.webkitEnterFullscreen();

    }

相关文章

UITabBarController 是 iOS 中用于管理和显示选项卡界面的一...
UITableView的重用机制避免了频繁创建和销毁单元格的开销,使...
Objective-C中,类的实例变量(instance variables)和属性(...
从内存管理的角度来看,block可以作为方法的传入参数是因为b...
WKWebView 是 iOS 开发中用于显示网页内容的组件,它是在 iO...
OC中常用的多线程编程技术: 1. NSThread NSThread是Objecti...