dur
Атрибут dur
отображает простую длительность анимации.
Пять элементов используют данный атрибут: <animate>
, <animateColor>
(en-US), <animateMotion>
, <animateTransform>
(en-US), и <set>
(en-US)
html
<svg viewBox="0 0 220 150" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="100" height="100">
<animate
attributeType="XML"
attributeName="y"
from="0"
to="50"
dur="1s"
repeatCount="indefinite" />
</rect>
<rect x="120" y="0" width="100" height="100">
<animate
attributeType="XML"
attributeName="y"
from="0"
to="50"
dur="3s"
repeatCount="indefinite" />
</rect>
</svg>
Примечания к использованию
Значение |
<clock-value>
| indefinite | media
|
---|---|
Значение по умолчанию | indefinite |
Анимируемый | Нет |
<clock-value>
-
Задаёт длину простой длительности. Значение должно быть больше 0. Это значение может быть выражено в часах (
h
), минутах (m
), секундах (s
) или миллисекундах (ms
). Это позволяет объединить такое представление времени для предоставления некоторых сложных длительностей, таких как:hh:mm:ss.iii
илиmm:ss.iii
media
-
Задаёт простую длительность, как длительность, свойственной медиа. Это валидно только для элементов, которые определяют media.
indefinite
-
Задаёт простую длительность, как незаданную
Примечание: Интерполяция не будет работать, если простая длительность остаётся неопределённой (хотя это может быть полезно для элементов <set>
(en-US)).
Спецификации
Specification |
---|
SVG Animations Level 2 # DurAttribute |
Совместимость с браузерами
BCD tables only load in the browser