请原谅我的无知,SVG对我来说是非常新的。我试图让我的内联SVG中的一组元素产生悬停效果。每组元素都是一组圈子。我可以用CSS实现这种悬停效果,但显然这只有当鼠标放置在一个圆上时才会起作用。我想要的是当鼠标移过包含圆圈的整个区域时的效果,所以空间和圆圈组合在一起。悬停对SVG组元素的影响
<style>
svg {
height: 220px;
width: 400px;
background: grey;
}
.na circle,
.as circle {
fill: white;
}
.na:hover circle {
fill: blue;
}
</style>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<g class="na">
<circle cx="35%" cy="2.85%" r="2.8" />
<circle cx="36.75%" cy="2.85%" r="2.8" />
.
.
<circle cx="38.5%" cy="8.55%" r="2.8" />
<circle cx="40.25%" cy="8.55%" r="2.8" />
</g>
</svg>
在一组,你它们之间的圈子和空间去悬停闪烁移动鼠标时,请参阅。
如何让鼠标悬停在整个区域?有没有可用于此的SVG元素?
您是否尝试过''? –
robertc