如果几秒钟后在 div 内空闲，则隐藏鼠标光标

Question

如果鼠标处于非活动状态并位于特定 div 内，如何让鼠标隐藏？我的网站上有“html5gallery-box-0”div，如果用户让它空闲 over/inside 几秒钟后 div，我需要隐藏鼠标。这是我正在处理的 jsfiddle。

这是我用来在鼠标不活动时隐藏鼠标的 js。

$(function () {
    var timer;
    var fadeInBuffer = false;
    $(document).mousemove(function () {
        if (!fadeInBuffer) {
            if (timer) {
                console.log("clearTimer");
                clearTimeout(timer);
                timer = 0;
            }

                console.log("fadeIn");
            $('html').css({
                cursor: ''
            });
        } else {
            fadeInBuffer = false;
        }


        timer = setTimeout(function () {
            console.log("fadeout");
            $('html').css({
                cursor: 'none'
            });
            fadeInBuffer = true;
        }, 500)
    });
});

Answer 1

这会起作用

 $(function() {
    var timer;
    var fadeInBuffer = false;
    $(document).mousemove(function() {
        if (!fadeInBuffer && timer) {
            console.log("clearTimer");
            clearTimeout(timer);
            timer = 0;

            console.log("fadeIn");
            $('html').css({
                cursor: ''
            });
        } else {
            $('.html5gallery-box-0').css({
                cursor: 'default'
            });
            fadeInBuffer = false;
        }


        timer = setTimeout(function() {
            console.log("fadeout");
            $('.html5gallery-box-0').css({
                cursor: 'none'
            });

            fadeInBuffer = true;
        }, 2000)
    });
    $('.html5gallery-box-0').css({
        cursor: 'default'
    });
});

这里是 fiddle（如果你想改变空闲时间就去做吧，现在是 2 秒）。

http://jsfiddle.net/eugensunic/1Lsqpm3y/4/

如果几秒钟后在 div 内空闲，则隐藏鼠标光标

Hide mouse cursor if idle inside a div after some seconds

javascript

css

jquery

mouse-cursor