Hide div Element mit jQuery, wenn die Maus für eine gewisse Zeit nicht bewegt wird?

Question

Ich habe eine Broadcast-Video-Site mit einem Menü, das versteckt werden sollte, wenn sich die Maus eine Weile nicht bewegt (sagen wir 10 Sekunden). Außerdem sollte es mit der Mausbewegung zurück erscheinen. Was ist der beste Weg, dies zu tun, indem Sie css und jQuery verwenden? Vielen Dank im Voraus.

Answer 1

Werfen Sie einen Blick auf das Ereignis mousemove. Sie können so etwas wie dies versuchen:

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

Demo: http://jsfiddle.net/AMn9v/6/