20
Июл
2021

AnimeJS path animate

Я анимирую движение блока по кругу с помощью animejs

let a = anime.path('svg circle')


let b = anime({
  targets: 'p',
  translateX: a('x'),
  translateY: a('y'),
  easing: 'linear',
  duration: 2000,
  loop: true,
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.0/anime.min.js"></script>

  <p>text</p>
<svg viewBox="0 0 400 400" fill="none" xmlns="http://www.w3.org/2000/svg">
  <circle class="circleAnime" cx="123.945" cy="123.945" r="75.445" transform="rotate(-90 123.945 123.945)" stroke="#5FE4BF" stroke-width="73"/>

</svg>

Однако я бы хотел останавливать в любом месте по пути при этом анимация должна заканчиваться тоесть pause() не подходит

Источник: https://ru.stackoverflow.com/questions/1307107/animejs-path-animate

Тебе может это понравится...

Добавить комментарий