Javascript 带有iOS Safari web浏览器的全屏html5视频

有没有办法在iOS Safari（移动网络）上触发全屏显示。全屏或全视窗都很好。以下是我尝试过的：

<video id="mobile_content"> 
  <source src="someurltocontent"></source>
</video>


function makefullscreen(element){
    if(element.requestFullscreen) {
        element.requestFullscreen();
    } 
    else if(element.mozRequestFullScreen) {
        element.mozRequestFullScreen();
    } 
    else if(element.webkitRequestFullscreen) {
        element.webkitRequestFullscreen();
    } 
    else if(element.msRequestFullscreen) {
        element.msRequestFullscreen();
    }
    else{
        var requestFullscreen = 
                document.documentElement.requestFullscreen ||
                document.documentElement.webkitRequestFullscreen ||
                document.documentElement.mozRequestFullscreen ||
                document.documentElement.requestFullScreen ||
                document.documentElement.webkitRequestFullScreen ||
                    document.documentElement.mozRequestFullScreen;

        if (requestFullscreen) {
           requestFullscreen.call(document.documentElement);
        } 
        else {
           console.log("really!? come on...");
        }
    }
}

函数makefullscreen（元素）{
if（element.requestFullscreen）{
元素。requestFullscreen（）；
} 
else if（element.mozRequestFullScreen）{
元素。mozRequestFullScreen（）；
} 
else if（element.webkitRequestFullscreen）{
元素。webkitRequestFullscreen（）；
} 
else if（element.msRequestFullscreen）{
元素。msRequestFullscreen（）；
}
否则{
var requestFullscreen=
document.documentElement.requestFullscreen||
document.documentElement.webkitRequestFullscreen||
document.documentElement.mozRequestFullscreen||
document.documentElement.requestFullScreen||
document.documentElement.webkitRequestFullScreen||
document.documentElement.mozRequestFullScreen；
如果（全屏）{
requestFullscreen.call（document.documentElement）；
} 
否则{
日志（“真的吗？来吧…”）；
}
}
}

在用户操作上，向上述函数传递一个视频元素，如果全屏可用，则在视频元素上执行全屏

这在Safari for IPAD上不起作用

---

一种解决方法是将controls attr应用于视频标签，然后让用户使用本机播放器全屏启动全屏

<video id="mobile_content" controls> 
     <source src="someurltocontent"></source>
</video>

---

除了前面提到的想法之外，还有什么其他想法吗？

您可以使用以下代码在Safari for iPad上的媒体DOM元素（如

视频
）上轻松触发全屏：

HTML

<div id="video-container">
    <video> 
        <source src="path/to/file.webm"></source>
        <source src="path/to/file.mp4"></source>
    </video>
</div>

然而，这种方法只适用于Safari for iPad中的媒体DOM元素，我总是在另一个DOM元素上请求全屏，比如
div
，
部分
等

似乎在Safari for iPad中的每个DOM元素上，
webkitRequestFullscreen
总是返回
undefined

祝你今天愉快

var videoContainer = document.getElementById('video-container');
var video          = videoContainer.getElementsByTagName('video');

function toggleVideoFullscreen() {

    if (video.webkitEnterFullScreen) {
        // Toggle fullscreen in Safari for iPad
        video.webkitEnterFullScreen();
    } else {
        // Toggle fullscreen for other OS / Devices / Browsers 
    }
}