Streaming live at 10am (PST)

Forgiving Hover for Dropdown Menu

Hi guys

I’ve been struggling this for couple of days.

We have a complicated dropdown menu on one of our projects with Open on Hover option.

Each dropdown list is huge and has several columns of items:

Users don’t try to reach a remote link using a ‘zig zag’ route:

Instead, they go directly and once the mouse leaves the Dropdown Toggle area, the dropdown disappears. Users are angry, we are frustrated:

We tried Close Delay and it works perfectly but not the way we expected. If we set Close Delay to 1s and use the Direct route to remote link then the dropdown will be active for 1s and will disappear anyway.

What would be nice if we somehow would be able to use Close Delay gap as a way to jump over another menu items safely, without closing the dropdown after Close Delay is over. And once we are on a safe area, detect the new hover on the dropdown list and don’t close it giving no attention to Close Delay.

We would appreciate any thoughts and ideas

Read-Only Example: https://preview.webflow.com/preview/kvs?utm_medium=preview_link&utm_source=designer&utm_content=kvs&preview=8d029b08316adc3c37e9d3bc05ccf5e2&mode=preview

Hello @ugleplastik,

so you can’t use the dropdown menus like you have them, typically dropdown menus from webflow only work when your links within your dropdown are position vertically, that is because the triggers are built that way. To accomplish what you are trying to make you will have to make a custom dropdown menu. I think this link will help you achieve that https://www.youtube.com/watch?v=BBTrIJFRnyY I hope this helps.

By setting up an interaction on the submenu that would state that when cursor is above it the menu should be explicitly visible you can alleviate the issue. I think :smiley: