jQuery - 简单的屏幕保护程序

Question

我尝试构建一个非常简单的屏幕保护程序,但它并不像我想象的那么容易.

我的解决方案没有真正起作用,这是恕我直言,真的很脏.

有没有人有一个干净的想法？也许没有超时？

HTML

<div id="screensaver" style="width:100%; height:100%; background-color:#000000; display:none;" > &nbsp; </div>

JS

  $('body').live('mousemove', function (e)
    {

      if (e.type == 'mousemove')
      {
        clearTimeout(s_saver);
        s_saver = setTimeout('$(\'#screensaver\').fadeIn();', 4000);
        $('#screensaver').hide();          
      }

    });  

http://jsfiddle.net/mwhJJ/4/

提前致谢!
彼得

Answer 1

您的脚本的主要问题是该s_saver变量未正确声明,并且位于错误的范围内 - 您需要在下次调用事件处理程序时仍然读取它,因此您应该将其声明在处理程序的范围之外.这应该工作(jsfiddle版本):

var s_saver;

$('body').mousemove(function() {
    clearTimeout(s_saver);

    s_saver = setTimeout(function(){
        $('#screensaver').fadeIn(900);
    }, 4000);

    $('#screensaver').fadeOut(100);
});

当然,这仍然取决于你想要达到的目标.例如,如果您想在用户没有查看此特定选项卡/窗口时显示某些内容而不是仅仅移动鼠标,那么此问题中提供的解决方案应该:如何检测非活动选项卡并填充它颜色