1
我想要动画svg元素。当我将duration
设置为1s
并根据它写keyTimes
时,它可以工作。但是,当我持续到2s
时,它会以某种方式破裂。duration =“2s”在动画svg元素上不起作用
这是工作的代码:
<rect id="Rectangle-8-Copy-4" fill="#D7E0E7" x="10" y="10" width="46" height="4">
<animate attributeName="fill" begin="0s" dur="1s" keyTimes="0;0.50;1" repeatCount="indefinite" values="#D7E0E7;#879CAD;#EBF0F3"/>
</rect>
https://jsfiddle.net/s3958psq/1/
当我改变持续时间两秒停止动画:
<rect id="Rectangle-8-Copy-4" fill="#D7E0E7" x="10" y="10" width="46" height="4">
<animate attributeName="fill" begin="0s" dur="2s" keyTimes="0;1;2" repeatCount="indefinite" values="#D7E0E7;#879CAD;#EBF0F3"/>
</rect>
https://jsfiddle.net/s3958psq/
我真的想知道这里发生了什么。
哦,谢谢。我不认为它是成比例的。这就说得通了。 – username