防止 YouTube 嵌入式播放器全屏显示

Question

由于 YouTube API 无法以编程方式触发全屏（显然有充分的理由，与旧版 Flash 支持相关，如 here 所述），我只能通过使用HTML5 Element.requestFullscreen API 全屏播放器 IFrame。

不幸的是，如果用户在 YouTube 播放器中触发全屏，则播放器本身会全屏而不是 IFrame，并且不会产生任何事件来表明它已经这样做了。当应用程序的其余部分不再知道什么是全屏和什么不是全屏时，这会破坏我的 UI 并导致其他同步问题。部分解决方案是使用 chromeless 播放器，然后呈现我自己的播放器控件，这样用户就无法单击 YouTube 全屏按钮 - 但是，结果是双击 YouTube video 也会导致它进入全屏模式，同样无法向应用程序的其余部分发出它已经这样做的信号。

那么，是否有任何一致的方法可以在不影响其他功能的情况下防止嵌入式 YouTube 播放器在任何情况下进入全屏模式？

到目前为止，我最好的解决方案是在 iframe 上设置指针事件：none。然而，这还不够完美，因为它也无法消除在 YouTube 视频上显示的广告横幅。一个理想的解决方案是阻止 "fullscreen on double-click" 响应，而不会弄乱其他任何东西。（例如，单击播放就可以了，因为 YouTube 播放器确实发出播放事件让我保持应用程序的其余部分同步。）

Answer 1

使用iframe标签嵌入时，可以使用参数fs = "0"禁用全屏按钮。参见 http://codepen.io/anon/pen/zvOqKJ

Answer 2

发生了一些奇怪的事情。当我按照此页面

使用 playerVars 传入 "fs: 0" 时，我无法阻止全屏显示

https://developers.google.com/youtube/player_parameters?playerVersion=HTML5

（即使其他一些玩家变量有所不同）

天知道哪里出了问题，但我用以下方法修复了它：

var ourYT = document.getElementById('player');
ourYT.allowFullscreen = false;

Answer 3

使用这个；

iframe {指针事件：none；}

您可以在 youtube 播放器上禁用点击事件（播放、暂停、全屏）；

防止 YouTube 嵌入式播放器全屏显示

Prevent YouTube Embedded Player from Fullscreening

javascript

youtube

video

iframe

html5-fullscreen