Собирает выпадающее меню из Zero-блоков: вы рисуете и меню, и его второй уровень как обычные блоки, а модификация связывает кнопки с подменю, раскрывает их по клику или наведению и подсвечивает активный пункт. При наведении подменю не закрывается, пока курсор идёт к нему, даже медленно.
Обычное меню Тильды не умеет показывать второй уровень так, как нарисовано в макете. Приходится собирать подменю из Zero-блоков и связывать их с кнопками вручную — под каждый пункт свой кусок кода с ID. Эта модификация связывает всё разом: кнопки находятся по классу, подменю — по ссылке кнопки.
Ссылка кнопки может быть двух видов. Обычная — #menu1, #menu2: номер в ней указывает, какой по счёту блок подменю раскрывать, и пропуски в нумерации не сбивают порядок. Точная — #rec123456, то есть адрес самого блока подменю: тогда порядок блоков на странице вообще не важен и меню не ломается при перестановке.
Модификация считает содержимым подменю только его элементы. Пустое место внутри блока подменю — не часть меню: курсор там или клик закрывают подменю, даже если у Zero-блока задан фон или фоновая картинка.
Это сделано намеренно: иначе забытый фон блока растягивает область меню на всю ширину страницы и ловит клики там, где визуально ничего нет. Нужен фон под подменю — добавьте в блок фигуру нужного размера и положите её ниже остальных элементов. Она будет полноценным элементом, и курсор на ней подменю не закроет.
Если между меню и подменю задан сдвиг, курсору приходится идти через пустоту. Полоса между нижним краем меню и верхним краем подменю считается частью меню: сколько бы курсор по ней ни шёл, подменю не закроется. Пауза перед закрытием нужна только для случаев, когда курсор ушёл в сторону, — например, обогнул подменю по краю.
aria-expanded и aria-controls, после Escape фокус возвращается на кнопку.Блок с подменю не занимает места на странице: он позиционируется поверх содержимого, поэтому под меню всегда должен быть хоть какой-то блок.
Войдите в аккаунт, чтобы увидеть код и настройки этой модификации