seregadushka
@seregadushka
minsk

SVG ломается при стандартной анимации?

Есть тренировочный сайт SVGmy , по анимации с SVG .
Все картинки SVG привязаны к внешнему стилю, одному. Не внешнему, но он внешний для самих SVG . Поэтому , там ограничений нет, (которые есть для внутренних стилей в SVG) работают даже переменные CSS.
Стиль такой, но он скорее к вопросу не относится. Или относится ?

.kran {
  --line: 20%;
  --space: 5%;
  --offset: 100%;
  --time: 12s ease-out;
  stroke-dasharray: var(--line) var(--space);
  animation: dash var(--time);
&:hover {
  animation: dash var(--time) alternate infinite; } }
@keyframes dash {
  from {stroke-dashoffset: var(--offset); }
    to {stroke-dashoffset: 0; }  }


Снизу дерево. Есть такой фреймворк UIkit , там куча всего, и плюс тоже есть стили(?) для SVG (кран ихний). У них это дерево рисуется ровно с той же анимацией -- Ukit-SVG.

Ведь без анимации дуб рисуется верно . По координатам. Как этот stroke-dashoffset:, который просто смещает штрихи, ломает координаты ? Так не может быть.

По идее должно быть наоборот ! Стандартная анимация не должна ничего ломать , на то она и стандартная. А не фреймворк, написанный парой человек. Вот такой убедительный довод.

Вопрос: где баГовая ветка в этом дубе :) ?
  • Вопрос задан
  • 115 просмотров
Решения вопроса 1
rqdkmndh
@rqdkmndh
Web-разработчик
Ваш поломанный путь:
<path id="path4034"
Просто удалите. Или загрузите в редактор SVG и редактируйте.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы