Как сделать такой навбар, с каталогом?

Question

[adil]

как сделать такой каталог, или скиньте источники

возникли серьезные проблемы с адаптивом и самой версткой. Конкретно с каталогом и навбаром.
Взяв этот проект не подумал что у меня нету таких навыков, а очень бы хотелось выполнить.

Answer 1

[sharpsss]

ну берешь делаешь контейнер display:flex; flex-direction:column; width:250px(например 250 пикселей);
в него фигачишь в первую очередь блок с display:none (на пк он будет скрыт изначально) потом блоки с товарами категориями что там? и да фигачить нужно их будет через ul/li , потом при адаптации делаешь медиа запрос который будет скрывать эти ul и показывать кнопку каталог товаров - то есть display:flex и display:none для ul ну и всё потом при нажатии на кнопку с каталогом делаешь

function show(){
const catalog= document.querySelector('.basket_mobile');
catalog.classList.toggle('show');
}
let button_catalog = document.querySelector('catalog');
button_catalog .addEventListener("click", show);

ах да забыл сказать сделай ещё класс show который просто display:flex; за счёт toggle будет добавляться и удаляться этот класс и таким образом будет выезжать твоя навигация , надеюсь понятно объяснил

Comments

[adil]

огромное спасибо, ща буду пробовать

[sharpsss]

adil, да пожалуйста,давай удачки тебе , если чёт не получатся будет можешь сюда в ответить писать я хабр иногда чекаю

Answer 2

[RimMirK]

тык