在空闲时间后隐藏我的鼠标光标,当我移动鼠标时它会出现

时间:2012-09-15 13:24:08

标签: javascript css cursor mouseevent

我正在创建一个阅读器Web应用程序。我希望在空闲时间后隐藏鼠标光标,当我使用JavaScript,CSS移动鼠标时,它会显示出来。

实现它的最佳方法是什么?

感谢

1 个答案:

答案 0 :(得分:1)

这对我有用(取自https://gist.github.com/josephwegner/1228975)。

注意带有id包装器的html元素的引用。

//Requires jQuery - http://code.jquery.com/jquery-1.6.4.min.js
$(document).ready(function() { 


    var idleMouseTimer;
    var forceMouseHide = false;

    $("body").css('cursor', 'none');

    $("#wrapper").mousemove(function(ev) {
            if(!forceMouseHide) {
                    $("body").css('cursor', '');

                    clearTimeout(idleMouseTimer);

                    idleMouseTimer = setTimeout(function() {
                            $("body").css('cursor', 'none');

                            forceMouseHide = true;
                            setTimeout(function() {
                                    forceMouseHide = false;
                            }, 200);
                    }, 1000);
            }
    });
});
相关问题