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