Cursore del mouse in dissolvenza quando inattivo (con jQuery)

Question

Ho un elemento con classe fade-object che scompare quando il mouse è inattivo per un certo periodo di tempo (5000 millisecondi in questo caso) e si dissolve nuovamente quando il mouse è inattivo spostato di nuovo.

Questo è il codice che sto utilizzando:

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

      $('.fade-object').fadeIn(); 
      timer = setTimeout(function() { 
       $('.fade-object').fadeOut() 
      }, 5000) 
     }) 

Come faccio a fare in modo che il cursore del mouse svanisce dentro e fuori allo stesso modo, in sincronia con il mio fade-object div?

Answer 1

Set cursor: none nel CSS del html e prevenire l'evento mousemove che si verifica subito dopo un fadeout da re-visualizzazione del prodotto.

Demo

$(function() { 
    var timer; 
    var fadeInBuffer = false; 
    $(document).mousemove(function() { 
     if (!fadeInBuffer) { 
      if (timer) { 
       clearTimeout(timer); 
       timer = 0; 
      } 
      $('.fade-object').fadeIn(); 
      $('html').css({ 
       cursor: '' 
      }); 
     } else { 
      fadeInBuffer = false; 
     } 


     timer = setTimeout(function() { 
      $('.fade-object').fadeOut() 
      $('html').css({ 
       cursor: 'none' 
      }); 
      fadeInBuffer = true; 
     }, 5000) 
    }); 
}); 

Answer 2

Applicare cursor: none tramite jQuery con un ritardo. Non pensare che sia possibile farlo svanire.

L'utilizzo di questa proprietà css è limitato a Firefox 3+, Safari 5+ e Chrome 5+. Non è supportato in IE (come indicato here).

ho messo un esempio a jsBin, nel mio browser non funziona (Firefox 19.0.2 su linux), testarlo con ben browser come si può :)

Comunque non posso raccomandare tale una tecnica, non è mai una buona idea nascondere qualcosa all'utente che non fa parte dell'interfaccia utente, se ci pensate il cursore del mouse fa parte dell'interfaccia utente del sistema operativo.