i want my jquery animation to wait till mouse enters for 2 second

Question

1. I want my jquery-animation to wait till my mouse hovers/enters it for about 2 seconds. Otherwise, when i'm about to make the image bigger, things will become really chaotic. 2.here's my code, which uses jquery to make a image bigger when it does a mouseenter:

    $('img').mouseenter(function(){
   
        $(this).animate({
               height: '+=40px',
           width: '+=40px'
           });
   
   });
   $('img').mouseleave(function() {    
   
       $(this).animate({
               height: '-=40px',
           width: '-=40px'
           }); 
   
   });
   

Answer 1

use delay();

  $('img').mouseenter(function(){
     var _width = $(this).width();
    var _height = $(this).width();
     $(this).stop().delay(2000).animate({
            height: '+=40px',
        width: '+=40px'
     });
    $(this).mouseleave(function() {    

    $(this).stop().animate({
            height: _height+'px',
        width: _width+'px'
        }); 


});

});

UPdated: http://jsfiddle.net/fwUMx/1165/