Модификация находится в бета-версии. Если нашли ошибку, сообщите о ней здесь
Поп-ап из Zero-блоков
Позволяет создавать полностью кастомные слайдеры из Zero-блоков — с управлением кнопками, зацикливанием, табами и настраиваемой анимацией
Модификация
Модификация
Поп-ап с формой обратной связи
Инструкция по установке
- 1Cкопируйте код ниже и вставьте его внутрь <head> в настройках сайтаЭтот код устанавливается только один раз. Если он уже стоит у вас на сайте, добавлять его снова не нужно, просто пропустите этот шаг.
<script src="https://cdn.jsdelivr.net/gh/postnikovmd/tilda@1.1/popup.min.js"></script>- 1
- 2Добавьте на страницу стандартный блок BF503 (Popup: Information) и присвойте ему класс .uc-popupЕсли вы планируете использовать несколько поп-апов на странице, задайте им разные названия классов, например, .uc-popup1, .uc-popup2 и т.д.
- 3Добавьте на страницу Zero-блок с формой обратной связи, присвойте ему такой же класс и задайте его высоту в 100% экранаЕсли вы хотите создать своё сообщение об успешной отправке данных, добавьте ещё один Zero-блок с таким же классом и расположите его после формы
- 4Задайте ссылку для открытия поп-апа в настройках стандартного блока, а в Zero-блоке – поставьте ссылку #close для кнопок его закрытия
- 5Скройте стандартную кнопку отправки данных в настройках формы и добавьте в блок свою кнопку со ссылкой #submit
- 6Задайте в настройках модификации параметры анимации поп-апаВ сообщение об успешной отправке данных можно добавить lottie-анимацию. Для этого создайте в блоке шейп с классом .lottie, куда будет загружаться анимация и задайте в генераторе кода ссылку на файл с анимацией
- 7Скопируйте код и вставьте его в блок T123 в конец страницы
Как это сделано?
<script src="https://cdn.jsdelivr.net/gh/postnikovmd/tilda@1.1/popup.min.js"></script>
<script>popup.init(".uc-popup", { animation: "fade", style: { blur: 4 } })</script> 
Видео скоро появится…
Настройки модификации
Настройки модификации
Размытие фона
Скорость и тип переходов:
Класс поп-апа:
Анимация появления:
<script>popup.init(".uc-popup")</script>Особенности
- Работает с автоскейломМод работает с масштабированием так же корректно, как и без него
Документация
Элементы
Параметры
© 2024 Максим Постников. Все права защищены.
Обо мне
Проекты
Блог
Связаться
Модификации
Максим Постников
Столкнулись с ошибкой?
Расскажите подробнее о проблеме, при которой модификация не работает или работает неправильно
Расскажите подробнее о проблеме, при которой модификация работает неправильно
Сообщение отправлено
Спасибо за обращение! Мы провалидируем ошибку и исправим её в ближайшее время
Нравятся модификации?
Поделитесь впечатлениями от работы с библиотекой — обратная связь поможет нам стать лучше
Поделитесь впечатлениями о сервисе — обратная связь поможет нам стать лучше
Сообщение отправлено
Спасибо, что делитесь с нами! Это помогает нам развиваться и улучшать сервис
Оставьте тестовую заявку
Эта форма не собирает персональные данные. Можете вставить любой текст, чтобы протестировать форму
Хотите получить ответ? Напишите напрямую на почту hello@postnikovmd.com или в Telegram
Сообщение отправлено
Благодарим за ваш обращение! Мы свяжемся с вами в ближайшее время, чтобы обсудить детали запроса