No-code платформа для интеграции с российскими сервисами
Адаптер
Мы в соцсетях
Ответим на вопросы
Техподдержка
Образовательные курсы и гайды для IT-специалистов
Академия
Клиентам
О нас
Плагин для Тильды
Партнерам
NLM067 • ВРЕМЯ НАСТРОЙКИ: 2 МИНУТЫ
Как анимировать бордер у shape в Tilda?
Модификация поможет настроить толщину, градиент и скорость вращения бордера, а так же смену цветов при наведении.
Для корректной работы модификации включите поддержку jQuery. Подробнее. Как это сделать: Настройка сайта > Еще > Подключить jQuery на страницах сайта.
Инструкция (Развернуть↓)
1. Добавляешь в Зеро-блок шейп, к которому необходимо добавить анимацию. И указываешь ему тот же class, что и в генераторе (например, animNolimBorder).
Что бы указать class у элемента, нажимаешь на него правой кнопкой мыши и выбираешь из списка последнюю строку "Add CSS Class Name", далее, справа в настройках указываешь class.
2. В генераторе настраиваешь параметры эффекта:
3. Параметры эффекта при наведении:
4. Копируешь сгенерированный HTML код и вставляешь его в блок Т123;
Имей в виду:
Что бы указать class у элемента, нажимаешь на него правой кнопкой мыши и выбираешь из списка последнюю строку "Add CSS Class Name", далее, справа в настройках указываешь class.
2. В генераторе настраиваешь параметры эффекта:
- «Class шейпа» – Который указываешь в Зеро-блоке (например, animNolimBorder);
- «Ширина бордера»;
- «Цвет бордера»;
- «Тип цвета»;
- «Цвет 1 (элемента анимации)»;
- «Цвет 2 (элемента анимации)»;
- «Направления анимации»;
- «Длительность анимации (в секундах)»;
3. Параметры эффекта при наведении:
- «Цвет фона»;
- «Цвет бордера»;
- «Цвет 1 (элемента анимации)»;
- «Цвет 2 (элемента анимации)»;
4. Копируешь сгенерированный HTML код и вставляешь его в блок Т123;
Имей в виду:
- Не стабильно работает с sbs анимацией;
- Шейп обязательно должен быть цветным (не прозрачным)
Напишите в нашу поддержку — мы поможем с настройкой и внедрением.
Остались вопросы?
Шаг 4
Копировать код
Чтобы получить доступ к копированию кода и использовать его на сайте, выполните 4 простых шага:
Скопируйте код из генератора, вставьте его в блок T123 на вашем сайте в Тильде и опубликуйте страницу.
Настройте модификацию
Шаг 3
И получите доступ к библиотеке из более чем 200 модификаций.
Оплатите подписку
Шаг 2
Создать аккаунт — это быстро и просто.
Войдите или зарегистрируйтесь на платформе
Шаг 1
Ведутся технические работы((
Попробуйте перелогиниться, если не помогло, загляните к нам через 20 минут...
Попробуйте перелогиниться, если не помогло, загляните к нам через 20 минут...
Напишите в нашу поддержку — мы поможем с настройкой и внедрением.
Остались вопросы?
Шаг 3
Копировать код
Чтобы получить доступ к копированию кода и использовать его на сайте, выполните 3 простых шага:
Скопируйте код из генератора, вставьте его в блок T123 на вашем сайте в Тильде и опубликуйте страницу.
Настройте модификацию
Шаг 2
И получите доступ к библиотеке из более чем 200 модификаций.
Возобновите подписку
Шаг 1
Копировать код
Напишите в нашу поддержку — мы поможем с настройкой и внедрением.
Остались вопросы?
Шаг 3
Чтобы получить доступ к копированию кода и использовать его на сайте, выполните 3 простых шага:
Скопируйте код из генератора, вставьте его в блок T123 на вашем сайте в Тильде и опубликуйте страницу.
Настройте модификацию
Шаг 2
И получите доступ к библиотеке из более чем 200 модификаций.
Оплатите подписку
Шаг 1