自动全屏显示Youtube嵌入内容

Question

我在一个网页上嵌入了一段Youtube视频。

当用户使用HTML5 iframe with Youtube's API按下播放时，是否可以使视频全屏显示

使用Chromeless播放器不是一个选择，因为该网站是为iPads设计的。

Answer 1

更新2013年11月：这是可能的-真正的全屏，而不是全窗口，使用以下技术。正如@chrisg所说，YouTube JS没有“默认全屏”选项。

• 创建自定义播放按钮
• 使用YouTube JS API播放视频
• 使用HTML5全屏API使元素全屏

这是代码。

var $ = document.querySelector.bind(document);

// Once the user clicks a custom fullscreen button
$(playButtonClass).addEventListener('click', function(){
  // Play video and go fullscreen
  player.playVideo();

  var playerElement = $(playerWrapperClass);
  var requestFullScreen = playerElement.requestFullScreen || playerElement.mozRequestFullScreen || playerElement.webkitRequestFullScreen;
  if (requestFullScreen) {
    requestFullScreen.bind(playerElement)();
  }
})

Answer 2

据我所知，这在youtube嵌入代码或youtube javascript API中是不可能的。您必须编写自己的播放器才能具有此功能。

做一些阅读，看起来你可以使用无铬youtube播放器，它会将自己的大小调整到其父元素的宽度和高度。

这意味着如果你使用的是无铬播放器，你可以使用javascript来调整div的大小，同时触发play事件。

Answer 3

不，出于安全考虑，这是不可能的。

最终用户必须执行某些操作才能启动全屏。

如果你要运行一个Adobe AIR应用程序，你可以自动化全屏激活，而不需要最终用户做任何事情。但是，它将是一个桌面应用程序，而不是网页。