Why jQuery hover gets stuck sometimes and how to fix it?

Question

Sometimes when I hover on the elements the dropdown sucks and works vice versa, mostly when I'm already on the element and when the page starts to load, so you should test it with some reloads.

Check out : Live Preview

Video Screencast : Video Screencast Link

The jQuery:

  $(function() {
    $("ul > li").hover(function() {
      $(this).find("ul").stop(true, true).fadeIn('fast');
    }, function() {
      $(this).find("ul").stop(true, true).fadeOut('fast');
    });
  });

This snippet finds all ul's and fades in or out the ul's what inside of the parent ul.

Answer 1

It seems to work fine. There is an appearance of the drop down getting stuck if you move your mouse horizontally. This is because the width of the li tag spans the whole window. Maybe you just need to set a shorter width.