Модификация находится в бета-версии. Если нашли ошибку, сообщите о ней здесь

Модификации

+16

Максим Постников

hello@postnikovmd.com

Политика Конфиденциальности

+16

Главная
→
Модификации
→
Zero-прелоадер
→
Время настройки: 1 минута

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

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

Классический вариант прелоадера

Прелоадер с Lottie-анимацией

Модификация

Прелоадер из Zero‑блока

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

1

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

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

<script src="https://cdn.jsdelivr.net/gh/postnikovmd/tilda@1.1/preloader.min.js"></script>

1
2

Создайте Zero-блок с прелоадером, поместите его в начало страницы и задайте ему высоту в 100% экрана
3

Создайте в блоке с прелоадером шейп с классом .lottie. Внутри него будет отображаться анимация
4

Задайте в настройках модификации IDблока с прелоадером, параметры его поведения и укажите ссылку на файл с анимацией
5

Скопируйте код и вставьте его в блок T123 сразу после прелоадера

Видео скоро появится…

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

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

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

Задержка:

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

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

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

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

<script>preloader.init(".uc-preloader")</script>

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

Особенности

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

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

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

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

Документация

Параметры

Чат для дизайнеров

Вместе всё получится

3 000+ человек

Присоединяйтесь ко мне в Telegram-канале!

Чтобы узнавать о новых модификациях и получать оперативную тех. поддержку

t.me/postnikovmds

Можете меня поблагодарить

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

Присоединяйтесь ко мне в Telegram-канале!

Чтобы узнавать о новых модификациях и получать оперативную тех. поддержку

t.me/postnikovmds

Обо мне

Проекты

Блог

Связаться

Модификации

Максим Постников

Сообщить об ошибке

Политика Конфиденциальности

Столкнулись с ошибкой?

Расскажите подробнее о проблеме, при которой модификация не работает или работает неправильно

Хотите получить ответ по проблеме? Напишите напрямую на почту hello@postnikovmd.com или в Telegram

Хотите получить ответ по проблеме? Напишите напрямую на на почту или в Telegram

Расскажите подробнее о проблеме, при которой модификация работает неправильно

Сообщение отправлено

Спасибо за обращение! Мы провалидируем ошибку и исправим её в ближайшее время

Нравятся модификации?

Поделитесь впечатлениями от работы с библиотекой — обратная связь поможет нам стать лучше

Поделитесь впечатлениями о сервисе — обратная связь поможет нам стать лучше

Сообщение отправлено

Спасибо, что делитесь с нами! Это помогает нам развиваться и улучшать сервис