Jquery: comment faire disparaître quelque chose quand la souris est inactive. Lorsque la souris se déplace à nouveau, il se faneIn!

Question

J'ai un div appelé "#top". Je voudrais qu'il disparaisse lorsque la souris est ralenti pendant 3 secondes. Lorsque la souris se déplace à nouveau, faites-le apparaître (fondu, bien sûr)

Est-ce que quelqu'un sait comment faire cela?

Merci beaucoup.

Answer 1

Utilisez setTimeout, sauvegarder la valeur de retour quelque part (pour l'annuler avec clearTimeout quand la souris se déplace à nouveau):

var timer; 
$(document).mousemove(function() { 
    if (timer) { 
     clearTimeout(timer); 
     timer = 0; 
    } 

    $('#top:visible').fadeIn(); 
    timer = setTimeout(function() { 
     $('#top').fadeOut() 
    }, 3000) 
}) 

Vous aurez envie ceci à l'intérieur $(document).ready() ou similaire.