Jquery timeout solution?

Question

Say (I simplify), I have 4 divs with content ... I like to disappear / hide them if the mouse is left without moving for 2 seconds and when the mouse starts up again ... let quikly make everything appear again .. .

How easy is it to do in jquery?

I'm not very used to timetout and mouse .. more css is used!

---

I google for the “concept” and find that: Hide the div element with jQuery when the mouse is not moving for some time?

I will explore, work!

Answer 1

You will need to create a timer that runs on each muzmo.

$(document).bind('mousemove', function() {
    var $somediv = $('#somediv');

    return function() {
        if(!$somediv.is(':visible'))
            $somediv.fadeIn('slow');

        this.tID && clearInterval(this.tID);
        this.tID = setTimeout(function() {
            $somediv.fadeOut('slow');
        }, 2000);
    };
}());

Demo : http://www.jsfiddle.net/ByrKk/

Answer 2

... : http://paulirish.com/2009/jquery-idletimer-plugin/ jquery.idle-timer.js