我已经创建了一个基本的svg动画，它每750毫秒循环一次，但是一旦它完成了一个动画循环，它会跳回到开头，给它一个丑陋的硬切外观。
<animate attributeName="stop-opacity" from="0.99" to="0.20" dur="750ms" repeatCount="indefinite" />
一旦不透明度从0.99下降到0.20，它是否有可能恢复到0.99而不是立即跳回到起始变量？
答案 0 :(得分：8)
您可以使用values上的animate属性指定多个值。使用此功能，您可以指定返回原始不透明度，甚至添加更多不透明度值：
<animate attributeName="stop-opacity" values="0.99;0.20;0.99" dur="750ms" repeatCount="indefinite" />
答案 1 :(得分：4)
Here是一个有效的例子。没有开箱即用的方法可以使用SMIL来回移动动画，但是您可以使用在第一个动画之后启动辅助动画的变通方法。这将循环并使SVG淡入和淡出的效果。
<animate id="anim1"attributeName="stop-opacity" from="0.99" to="0.20" dur="750ms" begin="0s; anim2.end" fill="freeze"/>
<animate id="anim2"attributeName="stop-opacity" from="0.20" to="0.99" dur="750ms" begin="anim1.end" fill="freeze"/>
这是我改变的两行。请注意，第一个结束时第二个动画开始，第二个动画结束后第二个动画结束（两个动画之间的循环）。