Затухание с использованием JQuery

Question

Вниз меню, и я использую jquery для затухания. Проблема в том, что я не могу найти, как выцветать, когда она покидает область мыши. У меня есть один заголовок, когда он витает над тремя выпадающими списками под одним именем div. Проблема в том, что когда она исчезает, я не могу заставить ее исчезать, когда мышь не находится в теге, в котором находятся все div. Пожалуйста, помогите

Code: 

<JQuery> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script> 
     $(document).ready(function(){ 
     $(".menu-ite").hover(function(){ 
     $(".menu-item").fadeIn(); 
     $(".menu-item").fadeIn("slow"); 
     $(".menu-item").fadeIn(3000); 

    }); 
}); 

Answer 1

$(".menu-item").on({ 
    mouseenter: function() { 
     //Do stuff when mouse hovers 
    }, 
    mouseleave: function() { 
     //Do stuff when mouse leaves 
    } 
}); 

Вы можете сделать несколько вещей с .on() обработчика.

.hover() имеет собственный обработчик, который вы можете прочитать больше о здесь: http://api.jquery.com/hover/

В качестве альтернативы, если вы работаете с объектами, сделанные после того, как документ будет готов, вы можете использовать это:

$(".menu-item").on('mouseenter', '.selector', function() { 
    //Do stuff when mouse hovers 
}); 
$(.menu-item").on('mouseleave', '.selector', function() { 
    //Do stuff when mouse leaves 
}); 

Answer 2

$(document).ready(function(){ 
    $(".menu-item").hover(function(){ 
    $(".menu-item").fadeIn(); 
    $(".menu-item").fadeIn("slow"); 
    $(".menu-item").fadeIn(3000); 
    }, function(){ 
    $(".menu-item").fadeOut(); 
    $(".menu-item").fadeOut("slow"); 
    $(".menu-item").fadeOut(3000); 
    }); 
}); 

ссылка: https://api.jquery.com/hover/#hover1