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

Кастомный прелоадер из Zero‑блока

Позволяет создавать кастомный прелоадер для сайта с настраиваемой логикой и поддержкой Lottie‑анимаций

Модификация

Прелоадер с lottie‑анимацией

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

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

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

Создайте Zero-блок с прелоадером, поместите его в начало страницы и задайте ему высоту в 100% экрана
Создайте в блоке с прелоадером шейп с классом .lottie. Внутри него будет отображаться анимация
Задайте в настройках модификации IDблока с прелоадером, параметры его поведения и укажите ссылку на файл с анимацией
Скопируйте код и вставьте его в блок T123 сразу после прелоадера

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

Скорость и тип переходов:

ID прелоадера:

Задержка:

Скрывать при повторной загрузке:

Оставьте пустым, чтобы прелоадер исчезал сразу после загрузки

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

Ссылка на файл с lottie-анимацией:

<!--preloader.js Прелоадер с Lottie-анимацией. https://postnikovmd.com/mods/preloader/lottie-->
<script>preloader.init(".uc-preloader")</script>

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

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

Мод работает с масштабированием так же корректно, как и без него
Работает в приложениях

Прелоадер работает во встроенных браузерах Telegram и Instagram*
Поддерживает анимации

Модификация поддерживает работу Lottie, базовых и SBS-анимаций