Эффект анимации текста при помощи TweenMaxАнимация текста TweenMax. Сегодня мы хотели бы поделиться с вами небольшим текстовым эффектом для слайд-шоу. Идея состоит в том, чтобы показать след затухания текста при переходе между слайдами слайд-шоу. Анимации сделаны с использованием TweenMax. Мы создали пять демонстраций с различной типографикой и эффектами для изображений при переходе от одного слайда к другому. Компоновка текстового эффекта создается с помощью контейнера flexbox, который уменьшает высоту каждого текстового контейнера.

Некоторые из текстов будут видны в полный рост (мы установили их специально для flex: нет ). Использование режимов наложения и поворотов также создает интересный эффект.

Анимация текста TweenMax и как это реализовать:

Обратите внимание, что это очень экспериментально и что мы используем современные свойства CSS, которые могут не поддерживаться в старых браузерах.

Как создать анимацию текста

Эффект анимации текста при помощи TweenMax 2-min

Эффект анимации текста при помощи TweenMax 3-min

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

Анимация текста TweenMax

В итоге

Конечно, такой эффект является эксперементальным и может работать не всегда и не на всех устройствах. Но в дальнейшем он может быть использовать как основа для большого проекта. Мы надеемся, что вам понравится этот эффект и вы найдете его полезным! Урок переведен из зарубежного источника и предоставлен исключительно в ознакомительных целях.