How to adjust drop down nav so that it doesn't disappear if you move the mouse diagonally to the nav item

Hello!

I am building a website with a complicated nav dropdown. There are 3 rows of items in the dropdown. If a user attempts to move their mouse from the dropdown link to the left or right hand side columns, the dropdown menu will disappear. However, if the user moves the mouse directly downwards into the dropdown area, then moves to the right or left hand side, the dropdown stays open. Does anyone know a way to improve this, so that users don’t get frustrated with the dropdown disappearing if they move their mouse diagonally to the dropdown items?

Thanks in advance!


Here is my public share link: Webflow - Richtech Robotics 2.0

Hey @Timothy_Tanksley, you can normally achieve this by setting a Close Delay in your Dropdown Settings. I have tried setting a value of 1000 ms to be able to tell if it’s working, but there is no delay happening at all. Deleting all the interactions for .navbar10_menu-dropdown solved this.

Weirdly enough, the dropdown list still disappears, unless your mouse has hovered over a link block once. I can’t find a solution to this issue, it seems to be some kind of bug.

It looks like you’re using the components from Relume, so I would suggest copying a navbar (i.e. navbar5_component) again, increasing the delay time and checking if this works. If yes, you’d have to recreate your navbar and dropdown list. Kind of annoying, but sometimes that’s the only solution.

I hope this helps. Let me know how you’re getting on.

2 Likes

Thank you so much Julian! I’ll try this out.

1 Like