Как сделать анимацию блоков как на Майншилде

Вот пример того, как можно создать анимацию с использованием CSS:

HTML:
```html
<div class="block"></div>
```

CSS:
```css
.block {
width: 100px;
height: 100px;
background-color: #ff0000; /* красный цвет */
position: absolute;
top: 50px;
left: 50px;
transition: all 1s ease; /* анимация для всех свойств, длительность 1 секунда, замедление */
}

.block:hover {
transform: translate(200px, 0); /* перемещение блока на 200px вправо при наведении */
}
```

В данном примере при наведении курсора на блок, блок будет плавно перемещаться на 200px вправо за 1 секунду, используя CSS transition.

Также вы можете использовать JavaScript для управления анимациями с помощью библиотеки, такой как jQuery или GSAP (GreenSock Animation Platform), которые предоставляют более широкие возможности для создания сложных анимаций, включая перемещение, вращение, изменение размеров и прозрачности элементов.

Вот пример использования jQuery для создания анимации перемещения блока:

HTML:
```html
<div class="block"></div>
```

JavaScript с использованием jQuery:
```javascript
$('.block').on('click', function() {
$(this).animate({left: '+=200px'}, 1000); // плавное перемещение блока на 200px вправо за 1 секунду при клике
});
```

GSAP также предоставляет мощные инструменты для создания анимаций, включая возможность управления временем, последовательностью анимаций, эффектами уско
рения и замедления, а также многое другое.