jQuery-简单的屏幕保护程序 [英] jQuery - Simple Screensaver

问题描述

我尝试构建一个非常简单的屏幕保护程序，但这并不像我想的那么简单.

I try to build a really simple screensaver, but it is not as easy as I thought.

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

My solution did not really work and it is IMHO really dirty.

有人有个好主意吗?也许没有超时?

Did anyone have a good clean idea? Maybe without a timeout?

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/

提前谢谢！
彼得

Thanks in advance!
Peter

推荐答案

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

The main problem with your script is that the s_saver variable is not declared properly, and is in the wrong scope - you need it to still be read the next time the event handler is called, so you should declare it outside the scope of the handler. This should work (jsfiddle version):

var s_saver;

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

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

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

当然，这仍然取决于您要实现的目标.例如，如果您想在用户不查看此特定选项卡/窗口而不是不移动鼠标的同时显示某些内容，则此问题中提供的解决方案应该执行以下操作:

Of course this is still dependent on what you want to achieve. If, for instance, you want to show something while your user isn't looking at this particular tab/window instead of just not moving the mouse, then the solution provided in this question should do: How to detect inactive tab and fill it with color

这篇关于jQuery-简单的屏幕保护程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！