4. Пульсирующая анимация

Средне
keyframestransformbox-shadow

Создайте CSS-анимацию пульсации для кнопки: плавное увеличение и уменьшение масштаба с изменением тени.

Каждый способ должен быть реализован независимо в своём контейнере:

  1. Анимация должна быть бесконечной
  2. Кнопка должна увеличиваться до scale(1.05)
  3. Длительность цикла — 2 секунды
  4. Должна изменяться тень (box-shadow)

Создайте анимацию pulse для элемента .pulse-btn. Кнопка должна плавно увеличиваться до scale(1.05) и получать более выраженную тень, затем возвращаться к исходному состоянию. Анимация должна быть бесконечной. Длительность одного цикла — 2 секунды.

Примеры

Пример 5
Вход:
<button class="pulse-btn">Click me</button>
Ожидаемый результат:

Кнопка плавно пульсирует с периодом 2 секунды

Ограничения

  • Использовать только CSS (без JavaScript)
0% принято
0 решений