Элемент 'set' - цикл
Я имею:
<set attributeName="visibility" attributeType="CSS" to="visible" begin="5s" fill="freeze"/>
<set attributeName="visibility" attributeType="CSS" to="hidden" begin="10s" fill="freeze"/>
Я хочу, чтобы цикл выполнял эти инструкции.
2 ответа
Если вы хотите, чтобы элемент постоянно "мигал", вы должны установить продолжительность анимации и начать ее, когда закончится другой. Например:
Демо: http://jsfiddle.net/rnSFY/
<svg xmlns="http://www.w3.org/2000/svg">
<circle fill="red" cx="50%" cy="50%" r="30" stroke="black">
<set id="show" attributeName="visibility" attributeType="CSS" to="visible"
begin="0s; hide.end" dur="1s" fill="freeze"/>
<set id="hide" attributeName="visibility" attributeType="CSS" to="hidden"
begin="show.end" dur="1s" fill="freeze"/>
</circle>
</svg>
Вместо того, чтобы переключаться между двумя различными статическими set
элементы, вы можете использовать один animate
это переключение между скрытым и видимым до бесконечности.
Тогда вам также не нужно беспокоиться о соединении времени начала с событием окончания другой анимации с именем
<svg xmlns="http://www.w3.org/2000/svg">
<circle fill="red" cx="50%" cy="50%" r="30" stroke="black">
<animate attributeType="CSS"
attributeName="visibility"
from="visible"
to="hidden"
dur="1s"
repeatCount="indefinite"/>
</circle>
</svg>