javascript - 爆米花.js : on mobile browser youtube "play" button does not appear

Question

一段时间以来，我一直在成功地将 Popcorn.js 用于 YouTube 视频。从最近开始，在移动浏览器上(在我的例子中是在 iPad 2 上)“播放”按钮不会像过去那样出现。视频将开始加载，您可以看到标题，但随后您看到的不是突出的“播放”按钮，而是黑屏，中间有一个小白点。检查源代码后，似乎 iFrame 的视频包装器中的视频采用了 CSS 样式，使视频的高度为 1px。

如果你按下那个几乎看不见的点，视频就会播放，爆米花代码也会正常执行。这几乎是一个交易破坏者。也许这是 YouTube 的事情而不是 Popcorn.js 的事情，但我只是在寻找方向。

请参阅这个基于 Popcorn.js 示例之一的简单 jsfiddle，例如:http://jsfiddle.net/Nzhpa/1/

代码:

var pop = Popcorn.smart("#container", "http://youtu.be/vDvmsTECAk4");

pop.footnote({
    start: 1,
    end: 5,
    text: "Works with youtube!",
    target: "footnote-div"
});

pop.play();

Answer 1

是 ipad 上的自动播放问题。

在

/popcorn-js/wrappers/youtube/popcorn.HTMLYouTubeVideoElement.js

在 onPlayerReady 函数中(第 108 行左右)，一些技巧用于初始加载的自动搜索和静音。该函数中的 player.playVideo(); 在 iPad 上中断了它，因为 youtube API 不允许在 iPad 上自动播放。它应该始终从用户交互开始

如果您评论 player.playVideo(); 行(对我而言)。

我不确定这是否会破坏其他东西。我会看看是否可以在爆米花上就此提出问题。