Элемент '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>

Другие вопросы по тегам