Navigation not hidding after hover on next element

Question

I need a navigation that when I mouse out, waits for 1 sec, and then hide,

I got my code here

http://jsfiddle.net/xR83q/

but it does not work correctly

Can you please tell me what I'm doing wrong?

Answer 1

Use mouseenter and mouseleave instead - change the last 2 lines to:

$j('#menu-navegacion-principal > li')
    .bind('mouseenter', navIn)
    .bind('mouseleave', navOut);

$j('#menu-navegacion-principal > li:has(ul)')
    .bind('mouseenter', navInS)
    .bind('mouseleave', navOutS)