Streaming live at 10am (PST)

Dropdown on hover doesn´t work



i tried to build an on hover dropdown menu and followed exactly this instructions on this topic:

But it doesn´t work properly. It actually might work after clicking one time on the navbar link. It´s really curious because it work if i build this in a completely new project.

Any ideas/suggestions?

The mentioned Navbar is on the Homepage. Here is the public link:


Dropdown on Hover is tricky anyway. See here how I do

(green public link in the sidebar)


The "secret" is that you have to catch the hover also on the submenu, to be able to catch the hover-out and close it. To do so, you need the menu to go under the bar and add a padding so it goes all the way under.


Hi Vincent,

it´s really curious. I do it like you said but it won´t work properly. It seems like that there´re two Droplists. After clicking one time on the hover it works. But to click is of course not the intention. And i changed the BG colour of the dropdownlist in to a red with a bit opacity to see what´s wrong. And there are two different dropdown lists.

This is the Public link, if wou want to take a closer look:

Thanks anyway for your help !


as far as I see it works on your site. you just have to add a hoverout that close the menu on the menu item itself (on top of having one, like you did, on the dropdown menu)


I could go crazy. There should be a bug with the dropdown element by itself. I rebuilt it exactly like in your example but either i missed something or there is just a bug in the element.

However, huge thanks for your effort to help me!



Make a screencast to show me what bugs, because I couldn't see it.


Hi Vincent,

here is a small screencast to show what´s the problem is. I guess it will be obvious. You can see that the "Hover & Hide" just work if i move the cursor out of the Dropdownlist below the Navbar.


can you put the public link back ?



Here it is:


I have deconstructed yours and mine and I don't see why it does not work... will look at it again later.


It´s curious. Isn´t it?

Ok. Thanks in advance.


I'm mad about this thing (: There must be a difference between your implementation and mine. Could you, for a start, create a blank page, and copy only your navbar in it? And test from there. At least we'll be sure nothing interact with it.


Done but unfortunately without success. I even created a new project before and build this navbar from scratch to be sure that no other script affect the dropdown. Again no success.


Can you put the navbar back on a page please ?


of course. i put it back



Hahahahahaha !



as i see the first two work well and the last one won´t. Right? And i presume they´ve all the same interactions and properties or could you find any difference Vincent?


I accidently delete my previous reply. Sorry.

This is totally insane. As i see they work well. Right? Did you find the mistake?


@aykut I come back to explain, i'm just narrowing everything down to be sure it's rock solid and that I understand what I've done (: