Всплывающее окно
Всплывающее окно (Pop-up) - виджет для создания окон с важной информацией, формой обратной связи или другим контентом. Не закрыв всплывающее окно, пользователь не может продолжать взаимодействовать с сайтом.
Виджет состоит из нескольких элементов:
- Слой перекрытия (Overlay) - затемненный слой под всплывающим окном
- Закрыть (Close) - стандартная кнопка закрытия окна
- Контент (Content) - область для размещения содержимого
Содержимое, которое вы хотите разместить в окне, нужно вставлять в элемент Контент. Вы можете добавить любые элементы, например, Текст, Картинку, Форму и т.п.
Виджет всплывающего окна нельзя перемещать в списке слоев - это закрепленный элемент. При вставке на страницу он помещается в конец списка элементов на вкладке Слои (Layers).
Всплывающее окно по умолчанию не отображается на сайте. Для того, чтобы пользователь его увидел, нужно настроить его открытие при определенном действии пользователя, например, при нажатии на кнопку.
Для этого выберите кнопку, при клике на которую будет открываться всплывающее окно, и настройте для нее параметры на вкладке Логика (Logic) правой панели:
- в разделе Действия (Actions) выберите действие Клик (Click)
- в настройках действия (Action Details) укажите:
- Запуск действия (Action trigger) - Клик (Click)
- Действие (Action) - Показать элемент (Show element)
- выберите (на Холсте или на вкладке Слои левой панели) в качестве элемента всплывающее окно
К всплывающему окну можно применить любые стили на вкладке Стилей (Styles) правой панели – изменить его размер, цвет фона, границы, закругление углов и т.д.
Вы также можете настроить цвет или прозрачность слоя перекрытия и изменить иконку кнопки закрытия.
Для всплывающего окна доступны следующие настройки на вкладке Настройки (Settings) правой панели:
Основные настройки (General) позволяют:
- отобразить/скрыть всплывающее окна на Холсте
- настроить закрытие всплывающего окна по клику на слое перекрытия
- настроить расположение кнопки закрытия на слое перекрытия или на самом окне
Настройки анимации (Animation) имеют следующие параметры:
- Эффект (Effect) - определяет эффект открытия и закрытия всплывающего окна
- Затухание (Fade)
- Уменьшение/увеличение (Zoom)
- Скольжение (Slide)
- Плавность анимации при открытии и закрытии
- Вид плавности анимации. Плавность анимации описывается с помощью кривых Безье, показывая скорость анимации на разных ее этапах. Вы можете выбрать нужный вид из выпадающего списка.
- Время анимации (в миллисекундах). Вы можете выбрать из выпадающего списка время анимации от 0 до 2000 мс или ввести свое значение.
