keytimes

keyTimes属性是分号分隔的时间值列表，用于控制动画的速率。列表中的每一个时间值对应于values属性列表中的一个值，并定义何时在动画中使用该值。每keyTimes列表中的每个时间值都被指定为介于0和1（含）之间的浮点值，表示与动画元素的持续时间成比例的偏移量。

如果指定了keyTimes列表，则列表中的值必须与keyTimes列表中的值的数目完全相同。

每个后续的时间值必须大于或等于先前的时间值。

该keyTimes列表的语义取决于插值方式：

对于线性（linear）和样条线（spline）动画，列表中的第一个时间值必须为0，列表中的最后一个时间值必须为1。与每个值关联的关键时间（key time）定义值何时设置; 值在关键时间之间被内插。

对于离散动画，列表中的第一个时间值必须为0。与每个值关联的时间定义值何时设置; 动画函数使用该值直到下一次定义keyTimes为止。

如果插值模式是paced，则该keyTimes属性被忽略。

如果持续时间不确定，则任何keyTimes规格都将被忽略。

用法上下文

Categories	Animation value attribute
Value	<list>
Animatable	No
Normative document	SVG 1.1 (2nd Edition)

实例

<?xml version="1.0"?>
<svg width="120" height="120"  
     viewPort="0 0 120 120" version="1.1"
     xmlns="http://www.w3.org/2000/svg">
 
    <circle cx="60" cy="10" r="10">
 
        <animate attributeName="cx"
                 attributeType="XML"
                 dur="4s"
                 values="60 ; 110 ; 60 ; 10 ; 60"
                 keyTimes="0 ; 0.25 ; 0.5 ; 0.75 ; 1"
                 repeatCount="indefinite"/>
 
        <animate attributeName="cy"
                 attributeType="XML"
                 dur="4s"
                 values="10 ; 60 ; 110 ; 60 ; 10 "
                 keyTimes="0 ; 0.25 ; 0.5 ; 0.75 ; 1"
                 repeatCount="indefinite"/>
 
    </circle>
</svg>

实时样例

适用元素

以下元素可以使用该keyTimes属性

<animate>

<animatecolor>

<animatemotion>

<animatetransform>