Задать вопрос
Ответы пользователя по тегу CSS
  • Svg css анимация?

    @4ce
    ⠀Такое?
    ⠀Что поменялось?
    <ellipse class="st1" cx="297.6" cy="420.9" rx="123.7" ry="20"/>
    заменено на:
    <ellipse class="st1" cx="297.6" cy="420.9" rx="123.7" ry="20">
    <animate attributeName="ry" dur="2s" repeatCount="indefinite" keyTimes="0;.5;1" values="20;0;20"/>
     </ellipse>

    ⠀Где: keyTimes="0;.5;1"(от 0 до 1) время изменения attributeName="ry"(ry) values="20;0;20"(значения ry) умноженное на dur="2s"(время анимации 2секунды) повторявшееся repeatCount="indefinite"(количество повторений сейчас:бесконечно)
    ⠀Но это не единственный вариант решения.
    ⠀В качестве шпаргалки при написании ответа пользовался статьёй A Guide to SVG Animations (SMIL) (найдено в google)
    Ответ написан
    1 комментарий