Как мне исчезнуть на 1 деление и исчезнуть на 2 деления, затем через 10 секунд бездействия снова исчезнуть на первом делении и исчезнуть на 2 деления?

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 out исчезает, а #header_left возвращается - но только после 10 секунд бездействия пользователя .Это должно быть просто, но для веб-дизайнера без опыта работы с jQuery - это действительно сложно.Уверен, вы, кодеры, сможете это выяснить за 20 секунд!

Спасибо!

На этот вопрос дан ответ.Спасибо!

Answer 1

Я думаю, что вам нужно что-то вроде этого:

$(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 секунд бездействия приводят к обратному замиранию.

Answer 2

Пол Ирландский создал плагин idleTimer для jQuery. Это очень удобно.