Продвинутый конструктор модальных окон

Контент

Дизайн

Поведение

Триггеры

Кнопки

Заголовок модального окна

Текст модального окна Добро пожаловать! Это пример текста в модальном окне.

Тип контента Текст HTML Изображение Видео Форма

HTML контент

URL изображения

Ширина

Высота

URL видео (YouTube/Vimeo)

Ширина

Высота

Поля формы

URL обработки формы

Метод отправки POST GET

Размер и положение

Ширина Маленькая (300px) Средняя (500px) Большая (700px) Очень большая (800px) На весь экран (90%) Пользовательская

Выравнивание По центру Вверху Вверху справа Вверху слева Внизу Внизу справа Внизу слева

Цвета и стили

Цвет заголовка

Цвет текста заголовка

Цвет фона

Цвет текста

Цвет кнопки закрытия

Закругление углов Нет Маленькое Среднее Большое Очень большое

Тень и граница

Тень Нет Маленькая Средняя Большая Очень большая

Граница Нет Тонкая серая Тонкая черная Средняя серая Средняя черная

Шрифты

Шрифт Arial Segoe UI Helvetica Georgia Times New Roman Courier New

Размер текста Маленький (14px) Средний (16px) Большой (18px) Очень большой (20px)

Отступы

Верхний отступ

Нижний отступ

Левый отступ

Правый отступ

Анимация

Анимация открытия Появление (fade) Скольжение вниз Скольжение вверх Скольжение слева Скольжение справа Увеличение Отскок

Анимация закрытия Исчезание (fade) Скольжение вверх Скольжение вниз Скольжение слева Скольжение справа Уменьшение

Скорость анимации Очень быстро (200ms) Быстро (300ms) Средне (500ms) Медленно (700ms) Очень медленно (1000ms)

Поведение

Закрывать по ESC

Закрывать при клике вне окна

Показывать кнопку закрытия

Задержка перед показом (мс)

Триггеры открытия

Тип триггера Клик по элементу Задержка после загрузки Прокрутка страницы Попытка ухода со страницы

ID или класс элемента для клика

Задержка (мс)

Процент прокрутки

Чувствительность (расстояние до верхней границы)

Дополнительные кнопки

Добавить кнопку

Стиль кнопок

Цвет фона

Цвет текста

Цвет фона при наведении

Цвет текста при наведении

Закругление углов Нет Маленькое Среднее Большое Очень большое

Размер Маленький Средний Большой

Предпросмотр

Полноэкранный просмотр

Код для вставки

Копировать HTML

Копировать CSS

Копировать JavaScript Копировать весь код

Закрыть

Текстовый логотип

+7 495 123-45-67hello@olympia.ru

© 2022 Олимпия