<分区>
javascript - 子项上方的 CSS box-shadow，但保持交互
我已经阅读了几个主题，例如:
和许多其他人，但我无法找到我所搜索内容的答案。当一个元素被放置在其他元素之上时，与这些元素的交互被破坏(没有事件通过)。这意味着，无法选择基础文本或不会触发元素事件。这是关于 jsFiddle 的演示.
如您所见，存在两个问题。
- 如前所述，无法选择文本，也无法将悬停事件传播到
div.hover元素。 div.shadow元素的大小不是绝对正确的。这就是为什么部分div.hover元素不在阴影框内(悬停事件到达悬停元素的地方)。
对于第一个问题，我希望有一个纯 CSS 解决方案，但我也会对一些 JavaScript 感到满意。
附录:Mozilla Firefox 15.0.1 上的问题 2
最佳答案
- 您可以使用 CSS
pointer-events属性(property)。根据此 jsFiddle 在div.shadow上设置它. - 我看不出问题出在哪里(使用 Chrome 23)。
更新
对于 #2，移除 div.wrapper 上的固定高度并添加 overflow: auto(这将允许 div.hovered 上的边距对 div.wrapper 产生一些影响)。看这个jsFiddle .
关于javascript - 子项上方的 CSS box-shadow，但保持交互，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12659809/