canvas 元素覆盖&穿透问题

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

canvas样式

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

解决穿透

给canvas样式添加如下属性:

    pointer-events:none;

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

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

    position:relative;

posted @ 2020-11-02 09:44  coding在路上~  阅读(4845)  评论(2编辑  收藏  举报