div的子级是否有可能设置为指针事件:没有指针事件?


72

div的子级是否有可能设置为指针事件:没有指针事件?

我需要拥有另一个div的div来允许指针事件通过,但div本身仍然具有事件。

这可能吗?

Answers:


137

是的,这是可能的,您基本上只是描述了如何。为父级禁用它,为子级启用它:

CSS:

.parent {
  pointer-events:none;        
}
.child {
    pointer-events:all;
}

HTML:

  <div class="parent">
    <a href="#">Parent</a>
    <div class="child">
      <a href="#">Child</a>        
    </div>
  ​</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

http://jsfiddle.net/4gQkT/


3
wooo,谢谢,我只是不知道可能的all价值。
2012年

但请注意:在CSS中将指针事件用于非SVG元素是实验性的。该功能曾经是CSS3 UI草案规范的一部分,但由于存在许多未解决的问题,因此已推迟到CSS4。 developer.mozilla.org/en-US/docs/CSS/pointer-events
KooiInc 2012年

此外,Internet Explorer(甚至IE10)也不支持它。
strah

4
考虑到其z-index工作原理,这是不可能的。
强尼

12
MDN表示pointer-events:all仅SVG。虽然这确实可行,但pointer-events:auto可能会更清楚。
伯纳德

3

在子元素的样式上,添加

pointer-events: auto;

pointer-events: all 不适用于我,并且显然仅适用于SVG元素。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.