setTimeout在jQuery動畫中

Question

我遇到setTimeout（）問題。我想，在鼠標狀態下，子菜單在間隔（500毫秒）後向上滑動。但setTimeout（）不起作用。

如在此鏈接：http://jsfiddle.net/felipepalazzo/Xyhvn/2/

代碼：

(function($){ 
    $.fn.showMenu = function(options){ 

     var settings = $.extend({ 
      height : '40px', 
      speed : '500', 
      heightx : '20px'    
     }, options || {}); 

     return this.each(function(){ 
      var elem = $(this); 
      var menu_timer; 
      elem.hover(function(){ 
       $(this).stop().animate({'height' : settings.height}, settings.speed); 
        }, function(){ 
         //setTimeout(function(){ 
         $(this).stop().animate({'height' : settings.heightx}, settings.speed); 
          //},500); 
        }); 
     });  
    }; 
})(jQuery); 

Answer 1

這是超出範圍。

var that = this; 
setTimeout(function(){ 
    $(that).stop().animate({'height' : settings.heightx}, settings.speed); 
},500); 

Answer 2

使用delay()

因此，例如

$(this).delay(500).stop().animate({'height' : settings.heightx}, settings.speed); 

Answer 3

我認爲這個問題依賴於要素$(this)上，當你在setTimeout的功能內的元素this它不是一樣。爲什麼你不嘗試的元素保存在一個變種，然後執行功能

var foo = this; 
setTimeout(function(){ 
    $(foo).stop().animate({'height' : settings.heightx}, settings.speed); 
},500);