Dropdown Mega Menus Not Updating Correctly On Hover

Hey all, I’m configuring a dropdown mega menu using triggers for Hover In/Hover Out actions.

It nearly works, but I’m having a small issue. The mega menus drop down as you scroll over their respective Nav Links, but when you scroll back over the different Nav Links (after scrolling over them once), the mega menus don’t update to the Nav Link selected.

When I look closely at the bottom borderline of the mega menus, it seems to get darker with every additional mega menu that loads, leading me to believe that the mega menus are loading on top of each other and staying there until they’re literally all displayed at once on top of each other. Really weird.

Any input would be awesome, appreciate it.

  1. I’ve configured the Nav Links (nav-link-3) to “Show” the mega menu for that specific dropdown link on “Mouse hover”
  2. I’ve configured the Mega Menus (“dropdown-mega-charts”) to “Hide” itself on “Mouse hover out”

Read only link: Webflow - Early Retirement & Remote Working Guide

Live link: Blog

How it should work (the template I used): https://headspace-navigation.webflow.io/