Question

我有一个全屏视频，带有HTML5。我能够在其上添加文本，但是Firefox上的开发工具似乎无法选择文本（这不是问题，但我认为这可能导致我的问题）。

我尝试添加两个图标静音和取消静音，并在其上添加OnClik事件。我可以看到这两个图标，但是当我点击它们时，没有任何反应。看起来我可以选择图像，但就是这样。

你知道为什么没有触发onclick事件吗？

我无法理解我可能缺少的东西......

谢谢！

答案：z-index不正确。标头具有-1 z索引，因此未重新计算单击事件。我的问题已修复！谢谢！

Answer 1

在此示例中，因为图像所在的.masthead元素设置为z-index:-1。任何鼠标与其及其子项的交互，无论其z-index位置如何，都会被位于z-index:0的主页内容阻止。

.masthead{
  position: relative;
  color:#fff;
  z-index:-1; /* this places your buttons behind everything else */
  overflow:hidden;
}

将.masthead移至索引0将解决此问题。