Skip to main content
Question

Switch items smoothly in navbar after hover triggered a dropdown

  • January 28, 2022
  • 3 replies
  • 2223 views

Clarisse

I’m trying to prototype a pretty basic dropdown interaction where a user can hover over a menu item which triggers an overlay dropdown menu. Dribbble menu is the perfect example of what I’m trying to do.

When mouse enters the menu item, user can navigate the dropdown no problem.

However, and that’s when problems start:

  • After the first dropdown is triggered, I am not able to hover any further items in the navbar, I have to click to enable the next interaction
  • Items interactions inside the dropdown are deactivated (not possible to click any link)

I tried several workarounds (eg. when mouse leaves overlay, it closes it but items are still not clickable inside the components and everything is jumpy)

Does anyone else experience this? Will this be handled by Figma someday?

This topic has been closed for replies.

3 replies

tank666
  • 4873 replies
  • January 28, 2022

Have a look at the files in this topic: How to create submenu that appears "While Hovering"

You can also search the Figma Community for similar menus.
I think this should help you.


Clarisse
  • Author
  • 1 reply
  • January 28, 2022

Thank you so much! It’s exactly what I was looking for


  • 0 replies
  • February 27, 2022

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings