Выпадающее меню из Zero Block
Раскрывает фиксированное меню по кнопке и скрывает его при выборе пункта или клике снаружи.
Что делает модификация
Раскрывает фиксированное меню по кнопке и скрывает его при выборе пункта или клике снаружи.
Требования
Проверьте классы, ID и адаптацию на опубликованной странице. Не устанавливайте несколько обработчиков для одних элементов.
Настройте под свой сайт
| Настройка | Назначение |
|---|---|
| ID блока с кнопкой | Выберите значение в интерфейсе личного кабинета. |
| ID блока меню | Выберите значение в интерфейсе личного кабинета. |
| Класс кнопки | Выберите значение в интерфейсе личного кабинета. |
| Класс пунктов | Выберите значение в интерфейсе личного кабинета. |
| Высота шапки, px | Параметр 0–400 |
| Раскрытие, ms | Параметр 0–2000 |
| Задержка открытия, ms | Параметр 0–3000 |
| Задержка закрытия, ms | Параметр 0–3000 |
Пошаговая установка
- Подготовьте шапкуСоздайте Zero Block с кнопкой butlink. Найдите ID блока и укажите headerId в кабинете.
- Подготовьте менюСоздайте второй Zero Block с пунктами menuitems. Укажите его ID menuId и высоту шапки: меню располагается сразу под ней.
- Настройте раскрытиеЗадайте длительность и задержки показа/закрытия. Все ссылки пунктов задайте штатно в Zero Block.
- Получите кодВ личном кабинете выберите параметры, нажмите «Сгенерировать код» и вставьте полный результат в блок T123 после подготовленных элементов. Не устанавливайте повторно обработчик для тех же элементов. Опубликуйте страницу.
- Проверьте закрытиеКнопка переключает меню, пункт и клик вне окна его закрывают. Для клавиатуры поддерживается Escape.
Проверьте классы, ID и адаптацию на опубликованной странице. Не устанавливайте несколько обработчиков для одних элементов.
Частые вопросы
Где менять параметры?
После покупки откройте модификацию в личном кабинете, выберите параметры и получите готовый код.
Нужно ли редактировать код вручную?
Параметры задаются в кабинете. Для составных модификаций вставьте подписанные части в места, указанные в инструкции.
Что показывает живой пример?
Пример показывает механику на демонстрационных элементах. На вашем сайте используются подготовленные блоки Tilda.