El desplazamiento heredado "Mouseleave" no funciona

Tengo un evento heredado al pasar el mouse que se ve así:

$('#menu').on("hover", '#menu li', function() {    
//mouse over LI and look for A element for transition
$(this).find('img')
    .animate( { opacity:1 }, 200)
});

Funciona para todos los elementos heredados, pero no puedo hacer que el evento "mouseleave" se herede. Si agrego:

    $('#menu').on("hover", '#menu li', function() {    
    //mouse over LI and look for A element for transition
    $(this).find('img')
        .animate( { opacity:1 }, 200)
},
function() {
    $(this).find('img')
        .animate( { opacity:0.5 }, 200)
});

no funciona ¿Cómo funciona el evento hover onleave?

preguntado el 12 de junio de 12 a las 11:06

3 Respuestas

$("#menu").on('mouseenter','#menu li', function(){

    $(this).find('img')
        .animate( { opacity:1 }, 200)
     })
.on('mouseleave','#menu li', function(){
$(this).find('img')
        .animate( { opacity:0.5 }, 200) 

});

Respondido el 12 de junio de 12 a las 11:06

hover no es un evento típico de javascript, debe dividir su enlace en mouseenter y mouseleave evento.

$('#menu').on("mouseenter", '#menu li', function() {    
    //mouse over LI and look for A element for transition
    $(this).find('img').animate( { opacity:1 }, 200)
});

$('#menu').on("mouseleave", '#menu li', function() {
    $(this).find('img').animate( { opacity:0.5 }, 200)
});

Vea http://api.jquery.com/hover/

Respondido el 12 de junio de 12 a las 11:06

$('#menu').on("mouseover", '#menu li', function() {    
    alert('mouse entered');
});

$('#menu').on("mouseleave", '#menu li', function() {    
   alert('mouse left');
});

Respondido el 12 de junio de 12 a las 11:06

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.