一个 div 正在阻止鼠标事件

Question

我在富 html 应用程序中遇到了一些鼠标事件问题。

我有一个大的“半透明”div，覆盖了屏幕的一半（该死的设计师）。我们就叫他A吧。

在这个A div的后面，有一个叫B的大容器。

在 B 内部，有 4 个 div 应该响应 mouseover 和 mouseout 事件。我们可以称它们为 C1、C2、C3 和 C4。

不幸的是，大胖的 A div 阻止了我所有的 Javascript/jQuery 事件。

这可以通过一些解决方法来解决，但事情是这样的：

• 此错误出现在自制的 Javascript 引擎中。我知道 B，但我不应该知道 B 中的 C 元素（或它们的 id）。 所以我既不能使用坐标技巧，也不能使用 if/else 解决方法。
• 应用程序应该在电视上运行（在一个奇怪的歌剧版本中）。所以没有“指针事件”的 CSS 技巧。
• 请不要让我重新设计我的应用 :)

我尝试处理（使用和不使用 jQuery）来自 A 的事件并将其触发到 B。它可以工作，但 B 不会将它转发给它的 C 子级，而且我再一次不知道它们.

Answer 1

这就是你要做的。大多数browsers 支持css pointer events。

在那些浏览器上使用：

#big-blocking-div {
  pointer-events: none;
}

对于不支持此 css 功能的浏览器，请执行此操作

#big-blocking-div {
  display : none;
}