Question

I have a dropdown menú you can see in the next example:

http://jsfiddle.net/WYMzX/1/

If I doing enter hover over submenu and after I go out from submenu working fine, but if I doing hover over “Menú” button and after I left or go out over the Menú button with mouse, the submenu is still open! 🙁 and not working fine for me

I want that if I leave the menú or submenú the sumenú is closed.

Thank you!

Answer 1

You had a few problems there

1 – You needed to set a width for the top level item – without a width it was filling the whole width of the screeen – which was why it wasn;t clearing the style.

2 – jquery hover can clear itself without the need to mouseleave

3 – the use of spans isn’t really necessary, apply your classes to you li and a tags and you’re fine.

here’s the working fiddle.

by the way, you can do all of this with pure css, but i’ve edited your example as I thought you might want to add transition animations or something.

http://jsfiddle.net/WYMzX/4/

—————EDIT————–

here’s a version that uses pure css for you, all you need to do is add

  ul#topnav li:hover .submenu{
  display: block!important;
  }

http://jsfiddle.net/zandergrin/WYMzX/6/