0

Responsive Nav (need help please)

anyone willing to walk me through making a responsive simple burger menu without bootstrap. I want to do it using HTML CSS and a small snippet of jQuery utilising a toggle class method. I'm a noob and having trouble with the markup. I would like the links to be the same height of the nav/header when hovered and also a logo in the header. I will post the HTML markup I have. https://code.sololearn.com/WHSqjefpFUwW

22nd Aug 2017, 1:58 AM
Jay
Jay - avatar
4 Antworten
22nd Aug 2017, 2:31 AM
Calviղ
Calviղ - avatar
+ 2
You can use transition CSS, but instead of auto height, need to specify the height value. Try this: nav ul { height: 0; overflow: hidden; transition: all 2s; } nav ul.open { height: 160px; }
22nd Aug 2017, 6:13 AM
Calviղ
Calviղ - avatar
+ 1
sweet it worked thank you again !
22nd Aug 2017, 6:25 AM
Jay
Jay - avatar
0
Hi Calvin thanks for the help, I got it !! :D one last thing is there a way to get the <ul> to slide down with css when the class is toggled to open?, currently the <ul> just appears because the class sets it to height:auto, I would like it to go from "0" to height:auto like a slide down effect. https://code.sololearn.com/WHSqjefpFUwW
22nd Aug 2017, 5:59 AM
Jay
Jay - avatar