2010-11-29 21 views
8

Tengo un sitio de video de transmisión, con un menú, que debe estar oculto, cuando el mouse no se mueve por un tiempo (digamos 10 segundos). Además, debería aparecer de nuevo, con el movimiento del mouse. ¿Cuál es la mejor manera de realizar eso, usando css y jQuery? Gracias de antemano.¿Ocultar elemento div con jQuery, cuando el mouse no se mueve durante un período de tiempo?

+0

¿Recibe eventos de movimiento del ratón cuando el ratón se mueve sobre el video? ¿O estás usando un complemento que detiene todos esos eventos burbujeando? Si no puedes utilizar el plugin (estoy asumiendo Flash), también se muestra el video para manejar el menú. – Douglas

Respuesta

20

Eche un vistazo al evento mousemove. Usted puede intentar algo como esto:

var i = null; 
$("#element").mousemove(function() { 
    clearTimeout(i); 
    $("#menu").show(); 
    i = setTimeout(function() { 
     $("#menu").hide(); 
    }, 10000); 
}).mouseleave(function() { 
    clearTimeout(i); 
    $("#menu").hide(); 
}); 

Demostración: http://jsfiddle.net/AMn9v/6/

+0

Genial, ¡eso es lo que busqué! Estaba mirando el evento mousemove, pero no pude entender cómo poner un Timeout en él. ¡Muchas gracias! – Maay

Cuestiones relacionadas