javascript - 降低非悬停元素的不透明度

Question

我有十二个 svg 路径。所有这些都具有 100% 的不透明度。

我想将悬停悬停在一条路径上，将其保持在 100% 并更改其他 11 条路径的不透明度。

Answer 1

在 SVG 中嵌入 CSS：

#paths:hover path {
     opacity:50%;
}
#paths path,
#paths:hover path:hover {
     opacity:100%; /* the default value */
}

<g id="paths">
    <path ... />
    <path ... />
    ...
</g>