Прелоадер из цветных квадратов для Tilda
Квадраты собираются волной и исчезают в выбранном порядке, открывая страницу.Подробнее о модеСвернуть описание
Прелоадер из цветных квадратов для Tilda
Квадраты собираются волной и исчезают в выбранном порядке, открывая страницу.Что умеет мод
- Создаёт сетку квадратов с палитрой от двух до пяти цветов.
- Настраивает размер, зазоры, скругление и плотность заполнения.
- Раздельно выбирает порядок сборки и исчезновения квадратов.
- Добавляет плашку с текстом и процентами в одной из девяти позиций.
Как подключить
Соберите палитру
Выберите фон, количество цветов и оттенки квадратов. Подберите размер ячейки, зазор и скругление. Настройте плотность: она определяет долю заполненных ячеек, а не их геометрический размер.
Выберите движение
Укажите отдельно порядок входа и выхода: из угла, из центра, от краёв или случайно. Подберите плавную или упругую анимацию, длительности, паузу и поворот при исчезновении. Проверьте весь переход, а не только начало.
Оформите индикатор
При необходимости включите плашку с текстом и проценты. Выберите положение и отступы от краёв. Отдельно настройте фон и скругление плашки, её внутренние отступы, шрифты и цвета текста и числа.
Установите и проверьте
Задайте максимальное ожидание и при необходимости задержку анимаций Tilda. Скопируйте код в T123 в начале страницы и опубликуйте. Проверьте плотность сетки на телефоне, положение плашки, уход квадратов и восстановление прокрутки.
Что учитывать. Проценты условно приближаются к 90, затем завершаются при переходе к выходу. Они не измеряют точный объём загруженных ресурсов. Код использует GSAP: берёт уже подключённую библиотеку или загружает её сам. При ошибке загрузки библиотеки заставка убирается. Используйте один прелоадер на странице.
Вопросы и ограничения
Можно задать разный порядок входа и выхода?
Да. Эти настройки независимы. Например, квадраты могут собираться из центра, а исчезать от выбранного угла.
Почему сетка каждый раз немного другая?
Цвета, прозрачность и заполненные ячейки выбираются случайно в пределах настроек. Плотность задаёт долю заполнения, а не фиксированный рисунок.
Можно убрать плашку?
Да. Отключите её показ, если нужна только геометрическая сцена. Текст и проценты оформляются внутри этой плашки.
Почему вместо волны видна неподвижная сетка?
При системном уменьшении движения код показывает статичную композицию и упрощённое исчезновение. Проверьте её вместе с обычной анимацией после публикации.
Доступ к конструктору
Мод доступен по подписке Pro. Войдите в аккаунт, чтобы настроить его и получить код. Действующие условия указаны в тарифах.
