JQuery hover flickering issue

Question

Hope people will be fine. Here is my main code:

http://jsfiddle.net/kr9pY/7/

in this demo you can see when we hover over a div with id = "container", a div with class = "nav" fades out. But the problem is that after that, if I visit the div with class = "nav" the div disappears and again, and if I move the cursor slightly inside the .nav div, it repeats this behavior again. I do not want this behavior when we hover over a .nav div or cursor in that div.

Thank you and sorry for my bad english.

Answer 1

Try

$(document).ready(function(){ 

   $("#containerNav").hover(
   function() { $('.nav').stop(true, true).fadeIn(); },
   function() { $('.nav').stop(true, true).fadeOut(); }
   );
   });

Taken from http://api.jquery.com/stop/

, div div, .

<div id="containerNav">
    <div class="nav"><a class="prev" href="#">Prev</a> <a class="next" href="#">Next</a>  </div>
    <div id="container">
        Some Content in Container
    </div>
</div>

, , , .

http://jsfiddle.net/kr9pY/9/