javascript - example - Jquery: cómo hacer desaparecer algo cuando el mouse está inactivo. Cuando el mouse se mueve de nuevo, ¡se desvanece!

mouseover jquery

Question

Tengo un div llamado "#top". Me gustaría que se desvanezca cuando el mouse esté inactivo durante 3 segundos. Cuando el mouse se mueve nuevamente, haz que aparezca (se desvanece, por supuesto)

¿Alguien sabe como hacer esto?

Muchas gracias.

Answer 1

Use setTimeout , guardando el valor de retorno en alguna parte (para cancelarlo con clearTimeout cuando el mouse se mueva de nuevo):

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

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

Querrá esto dentro de $(document).ready() o similar.