2010-11-29 7 views
8

J'ai un site de vidéo de diffusion, avec un menu, qui devrait être caché, lorsque la souris ne bouge pas pendant un moment (disons 10 secondes). De même, il devrait apparaître en arrière, avec le mouvement de la souris. Quelle est la meilleure façon d'y parvenir en utilisant css et jQuery? Merci d'avance.Masquer l'élément div avec jQuery, lorsque la souris ne bouge pas pendant un certain temps?

+0

Avez-vous des événements de déplacement de la souris lorsque la souris se déplace sur la vidéo? Ou utilisez-vous un plugin qui arrête tous ces événements bouillonnants? Si vous ne pouvez pas mieux utiliser n'importe quel plugin (je suppose que Flash) montre la vidéo pour gérer le menu aussi. – Douglas

Répondre

20

Jetez un coup d'œil à l'événement mousemove. Vous pouvez essayer quelque chose comme ceci:

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

Démo: http://jsfiddle.net/AMn9v/6/

+0

Super, c'est ce que j'ai cherché! Je regardais l'événement mousemove, mais je n'arrivais pas à comprendre comment y mettre un Timeout. Merci beaucoup! – Maay

Questions connexes