事件穿透父层 直达子层 pointer-events:none

　　　　之前我也做过一些canvas特效，往往在canvas全屏时，canvas下层的div就无法进行dom的事件操作，点击之类的就失灵了。之前我的做法要么就是在canvas上加入点击事件，穿透到下层，或者把下层的div通过z-index属性放在canvas的上层。这种办法都显得死板或者展现效果很差。

　　看了下面这段代码,发现了css3的解决办法:

.snow-canvas {
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    pointer-events: none;
}

就是通过pointer-events设置为none，可以让事件自动到下层去，不过坏处也有，就是通过F12开发者工具不容易找到canvas这个元素。

 

看看官方文档的解释:

 除了目前ie和ff的兼容性问题,还是很好用的

转载于:https://www.cnblogs.com/web-fusheng/p/6736140.html