Update has caused Sub Menu problems

[DMB]

Hi there!

I have had sub-menus working on a site I built for an artist for years now, but since the update they are broken. I see there are now options in the 'Customiser' for sub menus but the only options are to show the sub menu items on either hover or click – what about people (such as myself) who want them visible at all times? Would be quite simple to add that option in on the next update no?

I added a simple line of CSS to force the sub menu to show, but now it doesnt properly hide my menu when I scroll down, as I use the 'hide menu on scroll' function... Argh.

Could you help me fix this please? It's probably just a simple line of code to force the menu to be hidden further up when in its 'hidden' state but I cant figure out how to target it.

The site is:
https://www.hannahcollins.net/current-projects

You will see the problem if you scroll down – the menu is now not fully hidden.

Thank you in advance.

Best Wishes,
Duncan

[DMB]

In addition to this, it is also causing the active link in the sub-menu to be shown on two headings which is very confusing as well.

For example, here I am on the page 'Installation Views' but it is also highlighting 'Current Projects' – this never used to happen before

[Richard]

Dear Duncan

@DMB

"what about people (such as myself) who want them visible at all times?, Would be quite simple to add that option in on the next update no?"

Good point, I've added this thread to the development notes ✅

---

I'm unsure of your exact setup and what is being applied to the sub-menu via Lay Theme vs your own Custom code, however the main thing i see is that when the class 'hidden' is added to the Menu on scroll its pushed up but not enough ( only 36px )

It may not be the cleanest solution but the most efficient.

nav.laynav.primary.hidden {
    top: -70px !important;
}

The menu is out of view completely now, sadly the !important is needed to override the CSS that is initially passed by hidden being added, but apart from that its good. When you have more time, finding out a cleaner way to correct this may be a good idea 🌝

As for the second issue we have current-menu-parent also getting highlighted in addition to current-menu-item (getting the following blue added):

nav.laynav .current-menu-parent>a {
    color: #1100ff;
}

The colour is defined in Customizer ▸ Menu Style
Menu Point Active. But if you want no highlight then set the desired colour e.g:

nav.laynav .current-menu-parent>a {
    color: black;
}

---

Hope this helps Duncan let me know how you go! 💥

Richard