全屏 API 在 Chrome/iOS 上不起作用

Posted 2023-03-14

【中文标题】全屏 API 在 Chrome/iOS 上不起作用

【英文标题】：Fullscreen API not working on Chrome/iOS

【发布时间】：2013-12-16 02:19:41

【问题描述】：

当用户单击链接/按钮时，我试图全屏显示视频。这在桌面上运行良好，但在使用 chrome 的 iPad 上运行不佳。

根据这个http://caniuse.com/fullscreen 有一些限制，但我在那个桌子上找不到 chrome/ios。

如果有人告诉我这是一个操作系统限制，我将非常感谢来自好来源的链接。

这里有一些代码：

html：

<video id="video1"  controls>
    <source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4" />
    <source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg" />Your browser does not support HTML5 video.</video>

<button onclick="PlayFunction();">PLAY</button>

javascript：

 function PlayFunction()

        launchFullScreen(document.getElementById("video1")); // any individual element);
    $("#video1")[0].play();

function launchFullScreen(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 if (element.webkitRequestFullscreen) 

        element.webkitRequestFullscreen();
     else 

        alert("no cai en ningun lado");
    

JSfiddle：http://jsfiddle.net/9aSjn/16/

【参考方案1】：

根据这个链接http://www.mobilexweb.com/blog/chrome-ios-android-4-1-jelly-bean-html5：

那是因为 iOS 版 Chrome 不是 Chrome。什么？？它有一个 Chrome 风格的 UI、onmibox、语音搜索和 Chrome 同步。 但是，渲染和执行引擎不是 Chrome。

我称它们为伪浏览器，你可以看到我的意见和一个很好的 在我之前的帖子中讨论了 cmets 领域。所以适用于 iOS 的 Chrome 实际上是使用与共享大部分代码的 iOS Web 视图 野生动物园。

Chrome for iOS 使用的用户代理是 Safari 一对一 另外：“CriOS”（我猜是 iOS 版 Chrome）。没有“Chrome”字样 在用户代理内部，所以如果你正在做一些特别的事情 Chrome，你很安全，它不会在 Chrome 上执行 iOS。

结论，当您在 iOS 上使用 Chrome 时，您使用的是 Safari，这就是它没有出现在 caniuse 表中的原因。