Sub menus? Dropdown menu?
-
Hey guys!
Doing submenus is easy with some custom css!
For example on the nadine göpfert website we did it:
Custom CSS:
/*submenu*/ nav.primary .sub-menu li{ display: block; position: relative; } .sub-menu{ padding-top: 10px!important; opacity: 0; transition: opacity 200ms ease; -webkit-transition: opacity 200ms ease; pointer-events: none; position: absolute; } nav.primary li:hover .sub-menu{ opacity: 1; pointer-events: auto; } /**/ -
Thanks, @arminunruh. This looks awesome–doing this on my vertical menu.
Is there a good link on how to customize this CSS? Sorry I am a self-taught novice in need of guidance. -
Hey sorry that would be great if you can learn a bit about css for example here:
https://www.khanacademy.org/computing/computer-programming/html-css -
Hi @arminunruh,
I added the 'nadinegoepfert'-submenu script to the custom CSS and it works very well on in the desktop-version of my website (under 'shows'):However, somehow, after putting it into the 'custom css for desktop' it gets activated for the mobile version as well? Is there a way I can use it only for the desktop only? In the mobile version I would like all the menu points (including the submenus) to just line up under each other.
Many Thanks
-
-
-
-
@arminunruh said in Sub menus? Dropdown menu?:
Hi, it's been a long time that i've been on my website, i did almost the same submenu as Nadine Goepfert website, but actually, when i click on one of the link it just put it in the bar on top but it doesn't open it, probably a problem of actualisation but i don't know how to fix it, an idea ?
Thanks a lot
-
-
Hey guys!
Doing submenus is easy with some custom css!
For example on the nadine göpfert website we did it:
Custom CSS:
/*submenu*/ nav.primary .sub-menu li{ display: block; position: relative; } .sub-menu{ padding-top: 10px!important; opacity: 0; transition: opacity 200ms ease; -webkit-transition: opacity 200ms ease; pointer-events: none; position: absolute; } nav.primary li:hover .sub-menu{ opacity: 1; pointer-events: auto; } /**/HI @arminunruh
I entered the code but I don't understand why it doesn't work.
You could help me!
Thanks -
Dear @d44w
Can you post a link to our website?
Then we can have a look and inspect that.
Marius -
Hallo @arminunruh and @mariusjopen,
I would like to create several submenus under the caption WORK (http://schroederclaudia.com/work/)
For that I created pages like:feature, short, commissioned etc. e.g.: (http://schroederclaudia.com/feature)
I ve read that this is possible with CSS Customizer. What code would I have to insert there in order to make my „feature page“ be a submenu of my "WORK page"?
(I am using chrome )Help would be very appreciated. Thank you guys ;)
Claudia -
-
Hey guys!
Doing submenus is easy with some custom css!
For example on the nadine göpfert website we did it:
Custom CSS:
/*submenu*/ nav.primary .sub-menu li{ display: block; position: relative; } .sub-menu{ padding-top: 10px!important; opacity: 0; transition: opacity 200ms ease; -webkit-transition: opacity 200ms ease; pointer-events: none; position: absolute; } nav.primary li:hover .sub-menu{ opacity: 1; pointer-events: auto; } /**/
Hello! It looks like you're interested in this conversation, but you don't have an account yet.
Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.
With your input, this post could be even better 💗
Register Login