Как сделаю такую анимацию?

Для создания анимации на веб-сайте с помощью JavaScript вам необходимо использовать CSS анимации или же более гибкий подход с использованием библиотеки для анимации, например, Anime.js или GSAP.

Вот пример того, как можно создать анимацию с помощью Anime.js:

1. Подключите библиотеку Anime.js к вашему проекту. Вы можете сделать это через CDN или скачав библиотеку и подключив к проекту локально.

<script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js"></script>

2. Создайте HTML элемент, который вы хотите анимировать.

<div id="animated-element">Пример анимации</div>

3. Напишите JavaScript код, который задаст анимацию вашему элементу.

// Получаем элемент для анимации
const element = document.getElementById('animated-element');

// Описываем анимацию с помощью Anime.js
anime({
  targets: element,
  translateX: 250,
  rotate: '1turn',
  backgroundColor: '#FFF',
  duration: 2000,
  easing: 'easeInOutQuad'
});

В этом примере анимация будет смещать элемент на 250 пикселей по оси X, поворачивать его на 360 градусов, менять цвет фона на белый за 2 секунды, используя кривую плавности 'easeInOutQuad'.

Если вам нужно более сложная анимация, то вы можете использовать другие свойства Anime.js или GSAP, такие как scaleX, scaleY, opacity, и другие, чтобы создать более интересные и динамичные эффекты.

Не забывайте, что при работе с анимациями важно учитывать производительность, поэтому рекомендуется тестировать анимации на разных устройствах и браузерах, чтобы избежать возможных проблем.