jquery - Mousemove 事件适用于文档但不适用于“正文”

Question

我试图让一个 div 看起来像一个关闭的灯，当鼠标移动时，灯会打开。

我完成了鼠标移动打开灯的部分。看看这个小提琴。

jQuery代码：

$(document).mousemove(function() {
    $('div').addClass('glow');
});

我有两个问题

1. 如果我把'body'而不是document，它不起作用，为什么？

2. 如何检测鼠标停止？

Answer 1

1) 'body' 完美运行，但您必须将鼠标移到 body 上，直到窗口底部才移动（是的，body 是一个奇怪的，有时是不连贯的东西）。

2）要检测鼠标停止，最简单的解决方案是使用setTimeout并定义一个延迟：

(function (){
    var i =0;
    var timer;
    $('body').mousemove(function() {
        clearTimeout(timer);
        // 'body' doesn't work instead of document
        i += 1;
        $('p').text(function() {
            return 'Moved: ' + i;
        });
        $('div').addClass('glow');
        timer = setTimeout(function(){$('div').removeClass('glow')}, 2000);
    });     
})();

示范