canvas 元素覆盖&穿透问题

给网站添加canvas动态背景.完后发现有a标签无法点击,想到是canvas覆盖了(但有些是可以的).网上查找,有解决穿透的问题,但canvas的鼠标事件会无效.后发现是定位问题.

canvas样式

canvas {
  position: fixed;
  width: 100%;
  height: 100%;
}

解决穿透

给canvas样式添加如下属性:

    pointer-events:none;

实现穿透且保留canvas鼠标事件

给被覆盖的dom元素样式添加如下属性:

    position:relative;

---

原文地址: https://www.zhuyilong.fun/tech/canvas_dom.html