JQuery mouseout timeout

Question

Аналогичные проблемы были рассмотрены ранее, но я считаю, что мой немного отличается из-за использования функции bind(). Так или иначе ...

$('.overlay').bind("mouseenter",function(){ 
    $(this).fadeTo('slow', 0); 
}).bind("mouseleave",function(){     
    setTimeout(function() { 
    $(this).fadeTo('slow', 1); 
    }, 2000); 
}); 

Я хочу, чтобы исчезнуть из наложения на «MouseEnter», но только постепенно исчезать еще в 2000 мс после «MouseLeave».

У меня есть дополнительный вопрос: когда div .overlay исчезает, мне нужно иметь возможность нажимать на то, что находится под ним. I.e. Мне нужно, чтобы div полностью исчез или сместился вниз по стеку z-index. Однако, если я попытаюсь добавить это, сценарий считает, что мышь оставила div .overlay, поэтому .overlay исчезает.

По той же причине я не могу использовать fadeOut() и fadeIn().

Answer 1

Когда тайм-аут this не будет тем, что вы ожидаете. Вы можете создать укупорочные так:

  $('.overlay').bind("mouseenter",function(){ 
        $(this).fadeTo('slow', 0); 
        }).bind("mouseleave",function(){ 
        var $this = $(this);        
        setTimeout(function() { 
          $this.fadeTo('slow', 1); 
          }, 2000); 
      });