0
我现在的SVG使用SMIL动画转换SVG的SMIL动画CSS3动画
<svg viewBox="0 0 64 64">
<g>
<circle r="5" cx="24" cy="0" transform="translate(32,32)" stroke-width="0">
<animate attributeName="fill-opacity" dur="750ms" values="1;.9;.85;.7;.4;.3;.3;.3;1" repeatCount="indefinite"></animate>
</circle>
<circle r="5" cx="16.970562748477143" cy="16.97056274847714" transform="translate(32,32)" stroke-width="0">
<animate attributeName="fill-opacity" dur="750ms" values=".3;1;.9;.85;.7;.4;.3;.3;.3" repeatCount="indefinite"></animate>
</circle>
<circle r="5" cx="1.4695761589768238e-15" cy="24" transform="translate(32,32)" stroke-width="0">
<animate attributeName="fill-opacity" dur="750ms" values=".3;.3;1;.9;.85;.7;.4;.3;.3" repeatCount="indefinite"></animate>
</circle>
<circle r="5" cx="-16.97056274847714" cy="16.970562748477143" transform="translate(32,32)" stroke-width="0">
<animate attributeName="fill-opacity" dur="750ms" values=".3;.3;.3;1;.9;.85;.7;.4;.3" repeatCount="indefinite"></animate>
</circle>
<circle r="5" cx="-24" cy="2.9391523179536475e-15" transform="translate(32,32)" stroke-width="0">
<animate attributeName="fill-opacity" dur="750ms" values=".4;.3;.3;.3;1;.9;.85;.7;.4" repeatCount="indefinite"></animate>
</circle>
<circle r="5" cx="-16.970562748477143" cy="-16.97056274847714" transform="translate(32,32)" stroke-width="0">
<animate attributeName="fill-opacity" dur="750ms" values=".7;.4;.3;.3;.3;1;.9;.85;.7" repeatCount="indefinite"></animate>
</circle>
<circle r="5" cx="-4.408728476930472e-15" cy="-24" transform="translate(32,32)" stroke-width="0">
<animate attributeName="fill-opacity" dur="750ms" values=".85;.7;.4;.3;.3;.3;1;.9;.85" repeatCount="indefinite"></animate>
</circle>
<circle r="5" cx="16.970562748477136" cy="-16.970562748477143" transform="translate(32,32)" stroke-width="0">
<animate attributeName="fill-opacity" dur="750ms" values=".9;.85;.7;.4;.3;.3;.3;1;.9" repeatCount="indefinite"></animate>
</circle>
</g>
SVG的SMIL动画的动画在IE不支持。所以我想用CSS动画替换动画部分,使动画得到更广泛的支持。
如何用CSS动画替换上述SVG SMIL动画?
只需添加这种填充工具https://leunen.me/fakesmile/并获得SMIL IE支持而无需重新编写任何东西。 –