Html Firefox Mac阻止播放覆盖视频

不幸的是，当你直接点击YouTube播放器时，YouTube只统计视频的浏览量。这是为了防止欺诈性的高视图计数。如果您不想一开始就显示YouTube播放器，有一种方法是在顶部放置一个不透明的覆盖层和带有

指针事件的图形：none

。当用户点击你的覆盖图时，他们实际上是在点击YouTube视频，因此浏览量被计算在内。然后捕获“播放”事件并隐藏覆盖层，将玩家暴露在下面

我的主页上有一个图形，当你点击它时，它会播放YouTube视频。在任何人喊“点击劫持”之前，我不是想欺骗任何人——图形中有一个播放按钮，所以你知道这是一个视频

除了Mac OS上的FireFox之外，这一切对我来说都很好。我在测试中使用的是最新版本-目前为34.0.5

演示页面：

• 如果您在Chrome/FireFox Windows/最新IE版本中运行此功能，并单击绿色覆盖，视频将播放，您将听到音乐

• 注意：当然，在我的真实页面中，我捕获了

  isplaying

  事件并隐藏覆盖

Firefox显然在做一些点击劫持保护。如果它认为你试图用覆盖在视频上的覆盖物欺骗用户，那么它不会播放它。然而，对于我来说，这真的很奇怪，它在Windows上也不这么做

有两种方法可以让视频在Mac FireFox上播放-都包括部分显示下面的Youtube视频：

• 如果单击“将不透明度更改为75%”，它将在下方显示视频。如果你点击它，它就会播放得很好
• 如果单击“使覆盖层变小”，将使覆盖层不能完全覆盖视频。点击它就可以正常播放了

最奇怪的是，当您在iframe中查看它时，它工作得很好（这就是为什么我使用的是打开全屏的上图），而不是像codepen/jsfiddle这样的东西

我真的在寻找一个不涉及

if（firefox&&mac）

的解决方案。如果mozilla文档中有记录，我还没有找到它

注：显然，没有

指针事件的浏览器必须与点击事件区别对待。这在本例中没有显示

（我正在使用Browserstack.com进行测试，但在真正的mac电脑上也是如此。）
我也遇到了同样的问题Firefox mac（并且还没有升级到Yosemite），但在我看来，你几乎已经解决了你自己的问题。我能看到的最简单的解决方案是在当前图层下添加一个额外的覆盖层，并将它们都设置为不透明度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上

更新
好吧，这让我有点不知所措，或者说有些奇怪，可以用来形容不断期待一件事，却不断得到另一件事的经历。。。这和我的想法有着可怕的相似之处

为什么在[insert home planet here]上为Codepen做这项工作，而不是在我自己的本地主机服务的iframe中

在尝试了许多不同的东西之后，我发现了沙盒的
属性，这是我以前应该注意到的；特别是考虑到所有奇怪的诡计，它可以启用和禁用本机浏览器进程。一个快速的试验和一些错误之后，似乎是什么让这对大多数在线代码提琴手工作是以下几点：

<iframe src="index.html" sandbox="allow-scripts allow-same-origin"></iframe>



仍然没有找到确切的原因，但如果我在本地主机框架上启用上述功能，它将开始工作，而不需要不透明技巧。我猜这一定会导致Firefox通过另一个进程，或者它只是禁用了某种跨源点击劫持保护

一种非常奇怪的状态。。。这是一种奇怪的我会期待从铬！Firefox不太好。
如果你没有收到任何答案，我建议你在加州工作时间访问irc.mozilla.orc#Firefox上的FF开发者。我在mac osx Yosemite上运行34.0.5，工作正常。重置浏览器？@NicholasYoung感谢您的测试。我没有mac电脑，但在我的老板mac和Browserstack上都不起作用。只是为了确认你是说打开页面，点击绿色，音乐就会立即播放？你有像adblock/noscript这样的插件吗？@Simon_Weaver我的firefox完全没有任何插件，我在34.0.5中打开了它，点击绿色框，视频开始了playing@NicholasYoung你是在点击谷歌链接而不是代码笔链接吗。出于某种原因，框架集允许它在代码笔链接中工作。如果你点击googledrive链接，它会失效。我真想知道怎么做。实际上，我并没有抽出时间来测试两个98%的覆盖是否会欺骗浏览器，但很高兴知道它似乎起作用了。这绝对是一种选择，尽管
if（firefox&&mac）
也是如此，因为使用firefox+mac的用户比例相对较低：-）@Simon\u Weaver~嗨！是的，非常正确，尽管浏览器嗅探是p