Анимация

Использование

Вы можете анимировать практически любой элемент на сайте от кнопки до модального окна.

Для большинства компонентов доступны следующие настройки анимации:

  • Эффект анимации
  • Длина перемещения объекта
  • Длительность анимации
  • Задержка перед запуском анимации
  • Условие запуска

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

Эффекты анимации

Доступно 11 эффектов анимации.

Наведите указатель мыши, чтобы увидеть анимацию.
Появление
Увеличение
Уменьшение
Появление вверх
Появление справа
Появление вниз
Появление слева
Скольжение вверх
Скольжение справа
Скольжение вниз
Скольжение слева

Длина перемещения

Для анимации с перемещением доступно 2  дополнительных значения длины: короткое и длинное.

Длинное скольжение вверх
Длинное скольжение справа
Длинное скольжение вниз
Длинное скольжение слева
Короткое скольжение вверх
Короткое скольжение справа
Короткое скольжение вниз
Короткое скольжение слева

Длительность анимации

Доступны следующие настройки длительности: по умолчанию, быстро, медленно, а также кастомное значение.

Появление быстрое
Появление
Появление медленное
Скольжение слева быстрое
Скольжение слева
Скольжение слева медленное

Задержка перед запуском

Можно выбрать значение задержки от 0 до 1 секунды. При необходимости можно задать кастомное значение.

Без задержки
Задержка 0.2 сек
Задержка 0.4 сек
Задержка 0.6 сек
Задержка 0.8 сек
Задержка 1.0 сек

Условие запуска

Можно выбрать условие запуска анимации при появлении, по наведению или по клику.

При появлении
При наведении
При нажатии