SVG动作在浏览器/本地主机(SVG)中使用jsfiddle。

Question

我试图在我的SVG文件上创建一个悬停效果，即使我的鼠标在SVG的透明部分。从现在起，这个动作只有在悬停形状时才会被激活。我试过了

pointer-events: bounding-box;

没有任何运气(php风暴甚至不认识值)，也尝试了所有和其他值。奇怪的是，它在小提琴中工作，但在本地主机中不起作用。

谷歌就像疯了一样，希望有人有一个解决方案！

Answer 1

只需在SVG上设置pointer-events: none，并在父<div>上进行悬停测试。

​

div {
  width: 200px;
  height: 200px;
}

div:hover svg circle {
  fill: blue;
}

<div>
  <svg width="200px" height="200px" pointer-events="none">
    <circle cx="100" cy="100" r="95" fill="red"/>
  </svg>
</div>

​