--- title: dur slug: Web/SVG/Attribute/dur tags: - SVG - SVG атрибуты translation_of: Web/SVG/Attribute/dur ---
Атрибут dur
отображает простую длительность анимации.
Пять элементов используют данный атрибут: {{SVGElement("animate")}}, {{SVGElement("animateColor")}}, {{SVGElement("animateMotion")}}, {{SVGElement("animateTransform")}}, и {{SVGElement("set")}}
html, body, svg { height: 100%; }
<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>
{{EmbedLiveSample("topExample", "220", "150")}}
Значение | <clock-value> | indefinite | media |
---|---|
Значение по умолчанию | indefinite |
Анимируемый | Нет |
<clock-value>
h
), минутах (m
), секундах (s
) или миллисекундах (ms
). Это позволяет объединить такое представление времени для предоставления некоторых сложных длительностей, таких как: hh:mm:ss.iii
или mm:ss.iii
media
indefinite
Примечание: Интерполяция не будет работать, если простая длительность остается неопределенной (хотя это может быть полезно для элементов {{ SVGElement("set") }}).
Спецификация | Статус | Комментарий |
---|---|---|
{{SpecName("SVG Animations 2", "#DurAttribute", "dur")}} | {{Spec2("SVG Animations 2")}} | Без изменений |
{{SpecName("SVG1.1", "animate.html#DurAttribute", "dur")}} | {{Spec2("SVG1.1")}} | Изначальное определение |
{{Compat("svg.elements.animate.dur")}}