1. Главная страница
  2. Demo Upline GSAP Animations v1
  3. TimeLine - Demo Upline GSAP Animations

TimeLine - Upline GSAP Animations

Цепочки анимаций

Одна из интересных особенностей текущей версии компонента это возможность объединять анимации в цепочки. Т.е. если вы укажите для 2х анимируемых элементов одно название временной шкалы. То они будут размещены в одной временной шкале друг за другом и начнут анимироваться последовательно 1 за другим.

Пример без TimeLine

Пример c TimeLine

Порядок анимации зависит от того в каком порядке расположены ваши UplineGSAPAnimation модули в коде. Выполнение начинается от тех что выше на странице к тем что ниже.

Если вы привязываете анимацию к элементу через класс. То вы можете создать несколько UplineGSAPAnimation в рамках одно таймлайна и привязанных к одному классу.

Пример пошаговой анимации

Анимация выше сделана с помощью 2х модулей UplineGSAPAnimation оба привязаны к классу .crtl31

Доступные опции

Когда вы включаете Timeline на нескольких UplineGSAPAnimation компонентах, то на всех компонентах должны быть заполнены статус и Timeline Name. Остальные опции стоит заполнять только на первом модуле UplineGSAPAnimation опции остальных модулей будут игнорироваться.

Статус

Данные переключатель включает привязку к временной шкале, название которой вы укажете. Если вы не внесете название шкалы, то будет создана временная шкала по умолчанию. Все элементы без названия временной шкалы попадают на временную шкалу по умолчанию.

Timeline Name

Имя временной шкалы. Указывайте одинаковое имя для элементов которые должны быть в одной временной шкале.

Задержка (Delay)

Задержка до старта анимации записанной во временную шкалу.

Повторение анимации (Repeat)

Укажите количество повторений анимации. Для бесконечной анимации -1.

Эффект YOYO

Этот эффект делает так что анимация проигрывается до конца, а потом делает все тоже самое в обратном направлении.

Значения по умолчанию (defaults)

Можно указать значения по умолчанию для продолжительности анимации и характера анимации.

Примеры на стандартных блоках Creatium

Номер секции #363

МОЩНАЯ CRM-СИСТЕМА "MYBIRD"

Мы знаем, как привлечь внимание новых клиентов

Предлагаем попробовать CRM-систему c возможностью прямой коммуникации с потенциальными клиентами.

Номер секции #364

Преимущества системы

Интеграции с сервисами

У нас есть прямые интеграции со множеством сервисов. Настраиваются очень просто!

Мессенджер для проектов

Получайте сообщения от клиентов с помощью онлайн-чата, который легко добавляется на страницу.

Круглосуточная поддержка

Есть вопрос? Запутались или ещё не разобрались? Наша круглосуточная поддержка всегда поможет вам.

Работает на Creatium