JQuery hide mouse if it's not moving

html, javascript, jquery

Solution

Your initial problem is that the hiding of the mouse triggers `mousemove` and thus immediately resets it back to default. So you could solve that like this...

var justHidden = false;

$(document).ready(function() {
    var j;
    $(document).mousemove(function() {
        if (!justHidden) {
            justHidden = false;
            console.log('move');
            clearTimeout(j);
            $('html').css({cursor: 'default'});
            j = setTimeout('hide();', 1000);
        }
    });
});

function hide() {
    $('html').css({cursor: 'none'});
    justHidden = true;
}​

...BUUUUUT...

You face a problem here which at the moment seems unsolvable to me. That is, a hidden mouse does not trigger `mousemove` ever, so once it's hidden you will not be able to unhide it as far as I can tell.

I'll keep investigating to see if there's a solution I'm missing.

Problem

I'm trying to hide the mouse if it hasn't moved for a period of time. This is the code I'm using: ``` $(document).ready(function() { var j; $(document).mousemove(function() { clearTimeout(j); $('html').css({cursor: 'default'}); j = setTimeout('hide();', 1000); }); }); function hide() { $('html').css({cursor: 'none'}); } ``` When the hide() function is called the cursor is hidden, but unhides a split second later. Any help is appreciated.

Original source

Related problems