不幸的是，YouTube只在你直接点击YouTube播放器本身时才计算视频的观看次数。这是为了防止欺诈性地高观看次数。如果您最初不想显示YouTube播放器，一种技术是在顶部放置一个不透明的叠加层和图形，并带有pointer-events: none。当用户点击您的叠加层时，他们实际上会点击YouTube视频，因此观看次数被计算在内。然后，捕获"正在播放"事件并隐藏覆盖层，将玩家暴露在下面。
我的主页上有一个图形，当您单击它时，它会播放YouTube视频。在任何人喊"点击劫持"之前，我并不是想欺骗任何人 - 图形中有一个播放按钮，所以你知道这是一个视频。
这对我来说完全适用于除Mac OS上的FireFox之外的所有内容。我正在使用最新版本 - 目前在我的测试中为 34.0.5。
演示页 ： http://www.googledrive.com/host/0B3INRRYhLi7cVHNKTzhMdnRjT3M
-
如果您在Chrome/FireFox Windows/最近的IE版本中运行此内容，然后单击绿色覆盖层，视频将播放，您将听到音乐。
-
注意：当然，在我的真实页面中，我捕获了
isplaying事件并隐藏了叠加层。
Firefox显然正在做某种点击劫持保护。如果它认为您试图在视频上叠加来欺骗用户，那么它就不会播放它。然而，对我来说真的很奇怪，它也没有在 Windows 上做到这一点。
有两种方法可以让视频在Mac FireFox上播放 - 两者都涉及部分显示下面的Youtube视频：
- 如果单击"将不透明度更改为75%"，它将在下方显示视频。如果您然后单击它，那么它将播放正常。
- 如果单击"缩小叠加层"，将使叠加层无法完全覆盖视频。单击它将播放正常。
最奇怪的事情 - 当你在iframe中查看它时，它工作得很好（这就是为什么我使用上面的GoogleDrive链接可以全屏打开），而不是像codepen/jsfiddle这样的东西 http://codepen.io/anon/pen/GgrZNN
我真的在寻找一种不涉及if (firefox && mac)的解决方法.如果这记录在 Mozilla 文档中的某个地方，我还没有找到它。
显然，没有pointer-events的浏览器必须通过点击事件区别对待。此示例中未显示这一点。
（我正在使用 Browserstack.com 进行测试，但它在真正的Mac上也是如此。
我遇到了同样的问题 Firefox Mac（并且尚未升级到优胜美地），但在我看来，您几乎已经解决了自己的问题。我能看到的最简单的解决方案是在当前覆盖层下方添加一个额外的叠加层，并将它们都设置为不透明度 0.98（这似乎是您可以达到的最高水平，并且仍然可以使用点击工作——至少在我的测试中）。
显然，这取决于您希望在叠加层上显示的内容，但是对于我的本地测试，我将下层叠加层（对不起，荒谬的名称）设置为黑色。这意味着下面的视频是难以察觉的。您甚至可以降低不透明度，并且仍然用两层屏蔽所有内容，以防点击阻止的不透明度阈值在不同版本的 Firefox 中有所不同。
.x-overlay {
opacity: 0.98;
...
}
.x-under-overlay {
opacity: 0.98;
position: absolute;
background: rgba(0, 0, 0, 1);
width: 100%;
height: 100%;
overflow: hidden;
pointer-events: none;
}
注意：使用轻微的不透明度时要注意的一个缺点。对于某些浏览器（或至少是浏览器版本），出现在不透明度图层中的文本最终可能会出现错误或缺少抗锯齿。但这主要发生在旧版本的Firefox和Chrome中。
更新
好吧，这让我有点绕墙，或者弯道，或者哪个奇怪的短语可以用来描述不断期待一件事，但不断得到另一件事的经历......这与疯狂的定义有着惊人的相似之处。
为什么在[在此处插入家乡星球]上，这适用于Codepen，而不是在我自己的本地主机服务的iframe中......？？
在尝试了许多不同的事情之后，我发现了sandbox属性，我之前真的应该注意到这一点;特别是考虑到它可以通过本机浏览器进程启用和禁用的所有奇怪技巧。快速尝试和一些错误之后，似乎允许它适用于大多数在线代码小提琴手的原因如下：
<iframe src="index.html" sandbox="allow-scripts allow-same-origin"></iframe>
仍然没有找出确切的原因，但是如果我在我的本地主机框架上启用上述内容，它就会开始工作，而无需不透明度技巧。我想它一定会导致 Firefox 通过不同的进程进行路由，或者它可能只是禁用了某种跨源点击劫持保护。
一种非常奇怪的事态...这就是我对Chrome所期望的那种奇怪之处！不好的火狐。