Question

这是我目前的代码：

$(function() {          
        $('#header_left').click(function(){
            $('#header_left_info').fadeOut('fast');
            $('#header_left').fadeOut('fast');
            $('#header_left_back').delay(250).fadeIn('fast');
        });
});

（250毫秒的延迟是为了使衰落不冲突）

无论如何，我想修改现有的代码，以便它消除#header_left_back，#header_left重新进入 - 但仅在用户不活动10秒后。这应该很简单，但对于没有以前jQuery经验的网页设计师来说 - 这真的很难。 Betcha你的编码员可以在20秒内解决这个问题！

谢谢！

此问题已得到解答。谢谢！

Answer 1

Paul Irish为jQuery创建了一个idleTimer插件。它非常方便。

Answer 2

我认为你是在追求这样的事情：

$(function() {          
  $('#header_left').click(function(){
    $('#header_left_info, #header_left').fadeOut('fast');
    $('#header_left_back').delay(250).fadeIn('fast');
  });

  var timer;
  $(document).bind("keypress mousemove", function() {
    clearTimeout(timer);
    timer = setTimeout(function() {
              $('#header_left_back').fadeOut('fast', function() {
                $('#header_left').fadeIn('fast');
              });
            }, 10000);
  });
});

在没有鼠标移动或键盘操作10秒后，它将反向淡入淡出，将它们交换回来。您可以根据需要添加更多活动，例如mousewheel，mousedown，具体根据您的需要而定。每次事件发生时我们都会开始倒计时10秒钟，如果发生另一个事件，我们会清除超时并开始超时10秒，因此只有10秒的空闲时间会使倒退发生倒退。

如何淡出1个div并淡入2个div，然后在10秒不活动后，再次淡入第1个div，并淡出2个div？

2 个答案: