Время настройки: 1 минута

Анимация перемешивания текста

Добавляет эффект перемешивания букв в тексте с запуском по скроллу или нажатию определенной кнопки.

Инструкция по установке

Cкопируйте код ниже и вставьте его внутрь <head> в настройках сайта

Этот скрипт устанавливается только один раз и помогает модификациям работать. Если он уже стоит у вас на сайте, добавлять его снова не нужно, просто пропустите этот шаг.

<script src="https://cdn.postnikovmd.com/tilda@1.5/mods.min.js"></script>

Задайте тексту, для которого хотите применить эффект, класс .uc-shuffle

Если вы планируете использовать на странице несколько текстовых элементов с таким эффектом, задайте им разные классы, например, .uc-shuffle1, .uc-shuffle2 и т. д.
Как задать класс элементам?
Чтобы эффект запускался по кнопке, задайте ей ссылку #shuffle

Для нескольких текстовых элементов на странице, по аналогии, задайте разные названия ссылок и укажите их в настройках модификации.
Задайте в настройках модификации параметры анимации текста
Скопируйте код и вставьте его в блок T123 в конец страницы

Как это сделано?

<!--shuffle.js Анимация перемешивания текста. https://postnikovmd.com/mods/shuffle-->
<script>shuffle.init('.uc-title')</script>

Настройки модификации

Класс текстового элемента

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

Ссылка для запуска анимации

<!--shuffle.js Анимация перемешивания текста. https://postnikovmd.com/mods/shuffle-->
<script>shuffle.init(".uc-shuffle")</script>

Скопировать код

Работает с автоскейлом

Мод работает корректно как с масштабированием, так и без него
Запускается по триггеру

Если текстовый элемент находится в видимой зоне экрана
Запускается по кнопке

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