1. Главная страница
  2. ››
  3. Документация
  4. ››
  5. Анимация зероблоков - Продвинутое управление анимацией

Навигация

Разделы доки

Анимация зероблоков

В версии 4.2 и выше есть возможность анимировать элементы Zero блоков.

Для анимации вам потребуется

Классы на элемент Zero блока

  • Добавьте Zero-секцию или Zero-блок на страницу.
  • Разместите картинку, фигуру или любой другой элемент.
  • Перейдите в настройки и элемента и укажите имя класса. Например мы указали класс shar-2 для нашего маленького воздушного шара.

Импортировать модуль Upline GSAP Animations

Импортируйте на страницу компонент Upline GSAP Animations. Инструкция установки доступна на странице компонента.

Настроить анимацию с привязкой по классу

В настройках Upline GSAP Animations переходите в раздел Что анимируем? И выбираем в нем "Сторонний класс". В появившееся поле вписываем наш класс shar-2.

Теперь все настройки анимации будут применяться к элементам у которых на странице класс shar-2. Важно понимать, что если вы укажете несколько классов shar-2, то анимированы будут все классы. Больше про анимацию объектов с одним классом можно узнать в демо про Управление стадиями (Stager).

Ниже пример анимации Zero блока

Секция ниже сделана на основе Zero блока с анимацией отдельных элементов.
Вы можете импортировать секцию к себе в проект по коду 354 (Доступно для версии 4.2 и выше).

Logo Upline Studio Creatium

Наша команда Uplinestudio разрабатывает сайты под разные потребности клиентов. Одним из ключевых направлений в нашей разработке является создание сайтов на Creatium.

Оставить заявку

Работает на Creatium