Модификация находится в бета-версии. Если нашли ошибку, сообщите о ней здесь
Шапка и меню из Zero‑блоков
Позволяет создавать полностью кастомные хэдеры на основе Zero-блоков — с фиксацией, многоуровневым меню, меню-бургером и множеством других настроек
Дополнение
Дополнение
Меню-бургер для сайта
Инструкция по установке
- 1Создайте и подключите Zero-хэдер с фиксациейДля того, чтобы выпадающее меню работало, необходимо подключить базовый функционал шапки. Инструкцию по его установке можно найти здесь. Если у вас уже установлена шапка, этот шаг можно пропустить.
- 1
- 2Создайте Zero-блок с меню и присвойте ему класс .uc-menuФон блока должен быть прозрачным. Если вы хотите, чтобы при раскрытии меню появлялось затемнение, добавьте фильтр в настройках фона Zero-блока и поставьте его высоту в 100% экрана.
- 3Добавьте в хэдер свои кнопки открытия/закрытия меню. Для кнопки открытия поставьте ссылку #menu, а для закрытия – #menu-closeЕсли вы хотите, чтобы меню раскрывалось на весь экран, переместите кнопку закрытия в блок с меню и поставьте галочку в настройках модификации напротив параметра «Раскрывать на весь экран».
- 4Задайте в настройках модификации параметры анимации меню
- 5Скопируйте код и вставьте его в блок T123 после блока с меню и кода с хэдером
Чтобы в выпадающих меню выделялась активная страница, присвойте ссылкам класс .page. Если у ссылок есть дополнительные элементы (шейпы, иконки и др.), присвойте им класс .page-elem.
Для работы этой функции необходимо самостоятельно задать стили ссылкам и их элементам через CSS. Текущей ссылке и её элементам присваивается класс .current, используйте его для настройки активного состояния.
Для работы этой функции необходимо самостоятельно задать стили ссылкам и их элементам через CSS. Текущей ссылке и её элементам присваивается класс .current, используйте его для настройки активного состояния.
Видео скоро появится…
Настройки модификации
Настройки модификации
Анимация раскрытия:
Раскрывать на весь экран:
Если включено, открытое меню будет перекрывать шапку, если нет – отображаться под ней
Скорость и тип переходов:
<script>menu.init(".uc-menu")</script>Документация
Параметры
© 2024 Максим Постников. Все права защищены.
Обо мне
Проекты
Блог
Связаться
Модификации
Максим Постников
Столкнулись с ошибкой?
Расскажите подробнее о проблеме, при которой модификация не работает или работает неправильно
Расскажите подробнее о проблеме, при которой модификация работает неправильно
Сообщение отправлено
Спасибо за обращение! Мы провалидируем ошибку и исправим её в ближайшее время
Нравятся модификации?
Поделитесь впечатлениями от работы с библиотекой — обратная связь поможет нам стать лучше
Поделитесь впечатлениями о сервисе — обратная связь поможет нам стать лучше
Сообщение отправлено
Спасибо, что делитесь с нами! Это помогает нам развиваться и улучшать сервис