@DarkRou

Как анимировать SVG?

Хотел сделать анимацию для логотипа сайта, но раньше этим не занимался, искал в интернете, но там всё не то. Js пока не знаю, на чистом Css не нашел способа анимировать как мне надо, а в самом SVG коде анимировать как, не разобрался.
В общем, вот код моего SVG и мне нужно чтобы у волка моргал глаз
<?xml-stylesheet type="text/css" href="/css/style.css"?>
<svg version="1.1" id="Слой_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 2686 3591" style="enable-background:new 0 0 2686 3591;" xml:space="preserve">
<path class="logoPath logoColor blink" d="M1389.9,899.5c0,0,18,150,66,174s198-36,198-36S1473.9,881.5,1389.9,899.5z"/>
<path class="logoPath logoColor" d="M680.7,2597.5c-72,420,195,594,195,594c-31.5-182.1,147-496,147-496c4,488,400,552,400,552
	c-204-196-116-690-116-690c272,304,248,952,248,952c336-644,74-1153,74-1153c236,188,252,568,252,568
	c248.7-313.5,152.1-630.7,63.4-803.5c-35.7-69.6-91.8-126.6-160.9-163.4c-282.5-150.2-309.6-366.7-309.6-366.7
	c196.9,132.3,616.7,193.8,771.5,212.6c81.6,9.9,164.4-7.9,233.8-51.8c170.8-108.1,186.6-321,186.6-321c-180-150-725.3-409-725.3-409
	S1758.7,481,1204.7,421.5c0,0-19.5-204.9,26-390c-11.5,4.4-274.6,75.2-378.9,341.9c-21.8,55.7-62,109.8-120.3,122.8
	C498.3,548.5,76.4,841.6,53.7,1257.5c0,0,162-134,214-146c0,0-354,617-214,906c0,0,63.9-163,194-240c0,0-230,588-54,932
	c0,0,78-224,166-276c0,0-105,454,247,1038C606.7,3471.5,498.7,3011.5,680.7,2597.5z"/>
<path class="logoPath logoColor" d="M2505,1321c0,0,72.9,259.2,114.3,269.1"/>
<path class="logoPath logoColor" d="M1204.7,213.5c0,0,36-128,158-174c0,0-50,339,47,430"/>
</svg>
  • Вопрос задан
  • 153 просмотра
Решения вопроса 1
LenovoId
@LenovoId Куратор тега SVG
svg, css,js
https://ru.stackoverflow.com/a/1104085/308951 - зря удалил свой вопрос на SO
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы