使用CSS / Javascript / jQuery </rect>突出显示SVG组元素，如<rect>

Question

我试图在悬停时突出显示SVG元素作为发光元素。

我知道我们可以使用过滤器来使用它。

但是，我想知道有没有更简单的方法来实现这一点，使用CSS或JavaScript或JQuery

我知道以下代码适用于Chrome：

-webkit-svg-shadow: 0 0 7px red;

但我不能依赖这个代码，因为它在Safari或Firefox上不起作用。

有任何想法/建议吗？

Answer 1

这样的东西可能有效，只需在svg元素:hover上使用css-box阴影。

Fiddle

<强> HTML

<svg height=100 width=100 xmlns="http://www.w3.org/2000/svg"
 xmlns:xlink="http://www.w3.org/1999/xlink"></svg>

<强> CSS

svg{
    background-color:#ccc;
}
svg:hover{
    box-shadow: 0 0 20px yellow;
}