Youtube 视频嵌入循环答案

【问题标题】：Youtube video embed loopYoutube 视频嵌入循环
【发布时间】：2017-04-29 12:38:15
【问题描述】：

我已经制作了这个脚本，但我遇到了 2 个奇怪的问题：

<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
   <iframe frameborder="0" height="100%" width="100%" 
src="https://youtube.com/embed/kWoxV4HLgKg?rel=0&loop=1&autoplay=1&controls=0&showinfo=0&autohide=1">
   </iframe>
</div>

loop=1 不起作用，我不知道为什么。

我基于：https://developers.google.com/youtube/player_parameters#autoplay

此外，视频不会占据 100% 的屏幕，而是有 2 个黑带。

这两个问题能解决吗？

【问题讨论】：

标签： javascript html youtube

【解决方案1】：

正如 Ravi 所说，您需要将其添加到播放列表中才能在 iFrame 中自动播放。为了解决这个问题，我将播放列表设置为视频本身。

<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
    <iframe frameborder="0" height="100%" width="100%" 
            src="https://youtube.com/embed/kWoxV4HLgKg?
rel=0&autoplay=1&controls=0&showinfo=0&autohide=1&playlist=kWoxV4HLgKg&loop=1" 
frameborder="0" allowfullscreen></iframe>
</div>

至于黑带，这是因为视频的分辨率与屏幕的纵横比不匹配（因为全宽会使其成为宽屏，因此您会在两侧看到黑带）。如果您尝试使用具有宽屏分辨率的视频，您将看不到黑带。

【讨论】：

【解决方案2】：

这应该适合你。

https://www.youtube.com/embed/kWoxV4HLgKg?playlist=kWoxV4HLgKg&autoplay=1&controls=0&rel=0&showinfo=0&loop=1" frameborder="0"

似乎嵌入式播放器有时会变幻无常。
如果你愿意，可以尝试不同的东西HERE。

【讨论】：

【解决方案3】：

根据以下文档，循环将无法在 iframe 中运行。 https://developers.google.com/youtube/player_parameters#loop

关于文档中的 Loop 参数注意：此参数在 AS3 播放器和 IFrame 嵌入中的支持有限，它们可以加载 AS3 或 HTML5 播放器。目前，loop 参数仅在与 playlist 参数一起使用时才在 AS3 播放器中起作用。要循环播放单个视频，请将循环参数值设置为 1，并将播放列表参数值设置为已在 Player API URL 中指定的相同视频 ID

视频的尺寸为 854 像素 x 480 像素。您需要保持该纵横比以消除黑色空间。

【讨论】：