Всім привіт від автора блогу Di-grand. Давно не виставляв корисних фішок для верстання сайтів. Недавно верстав цікавий проєкт і зіткнувся з мега меню каталогу, яке випадало по кнопці. Це мега меню було не просте, так як займало всю ширину та повинно було працювати на телефонах.
Думав я як і всі професіонали* знайти готове рішення та адаптувати його. Но як виявилось, конкретно таких меню практично немає. Витративши кілька годин на пошуки, я вирішив зліпити його для себе та поділитись з вами. І так, ловіть демку, та качайте на здоров’я.
А ось так буде виглядати меню на мобільних пристроях. Воно повністю адаптивне, тому вам не прийдеться більше використовувати різні меню – одне для ПК, друге для телефонів. По кліку на пункт з меню, ви переходьте вправо в підменю, де є кнопка назад.
З нюансів – довго описувати, думаю наші читачі розберуться в коді. Там все досить просто. Якщо вам сподобалось меню, стало вам в пригоді – буду вдячний за публікацію посилання на нашу сторінку будь-де) Дякую! В кого є питання по адаптивному, вертикальному mega menu для каталогу, чи інтернет-магазину, пишіть в коменти. Буду радаий допогти. Слава Україні!
Залишити відповідь