Javascript SVG鼠标悬停在嵌套元素上不起作用
我想这样做,当您将鼠标悬停在嵌套组上时#sec7kpi-c,然后在继续鼠标悬停时进一步进入动画效果中的文本Javascript SVG鼠标悬停在嵌套元素上不起作用,javascript,svg,nested,mouseover,smil,Javascript,Svg,Nested,Mouseover,Smil,我想这样做,当您将鼠标悬停在嵌套组上时#sec7kpi-c,然后在继续鼠标悬停时进一步进入动画效果中的文本 <g transform="matrix(1 0 0 1 150 150)" id="sec7kpi"> <g transform="matrix(1 0 0 1 0 0)" id="sec7kpi-c"> <ellipse fill="#372356" stroke="#27AE60" stroke-width="16" stroke-miter
<g transform="matrix(1 0 0 1 150 150)" id="sec7kpi">
<g transform="matrix(1 0 0 1 0 0)" id="sec7kpi-c">
<ellipse fill="#372356" stroke="#27AE60" stroke-width="16" stroke-miterlimit="10" cx="0" cy="0" rx="71" ry="71" />
<text id="sec7text" x="-33" y="15" fill="#27AE60" font-family="LatoRegular" font-size="38.8363">KPI</text>
</g>
</g>
<animateTransform attributeType="XML"
xlink:href="#sec7kpi-c"
attributeName="transform"
type="scale"
dur="1s"
from="1"
to="2"
restart="whenNotActive"
begin="mouseover"
calcMode="spline"
values="1;1.5;1"
keyTimes="0;0.5;1"
keySplines=".16,.59,.46,.98;.88,.27,.37,1.52"
fill="freeze"
id="c-hover">
</animateTransform>
关键绩效指标
您可以将“文本指针事件”属性设置为“无”以避免出现这种情况
请注意,您的KeySpline值无效(它们必须都是),您可以将text-pointer events属性设置为none以避免此情况 请注意,您的KeySpline值无效(必须全部为空)