动画完成时执行代码jQuery

Question

$(this).animate({"left": left+"px"}, { queue: false, duration: 500 }) 
.animate({"top": top+"px"}, { queue: false, duration: 500 }) 
.animate({"height": size+"px"}, { queue: false, duration: 500 }) 
.animate({"width": size+"px"}, { queue: false, duration: 500 }); 

我是jQuery的初学者。我想在动画完成时运行以下代码：

$('#map').css('cursor','pointer'); 

我该怎么做？而且，如果我的代码不好，如果你改进了，我会非常感激。

谢谢！

Answer 1

你可以一次动画所有这些，使用"complete" callback：

$(this).animate({ 
    left: left + 'px', 
    top: top + 'px', 
    height: size + 'px', 
    width: size + 'px' 
}, { 
    queue: false, 
    duration: 500, 
    complete: function() { 
     $('#map').css('cursor','pointer'); 
    } 
}); 

Answer 2

试试这个：

$(this).animate(
    { // map of the properties to animate 
     'left': left + 'px', 
     'top': top + 'px', 
     'height': size + 'px', 
     'width': size + 'px' 
    }, 
    500, // animation duration 
    function() { // function to execute when animation is completed 
     $('#map').css('cursor','pointer'); 
    } 
); 

Answer 3

$(this).animate({"left": left+"px"}, { queue: false, duration: 500 }) 
    .animate({"top": top+"px"}, { queue: false, duration: 500 }) 
    .animate({"height": size+"px"}, { queue: false, duration: 500 }) 
    .animate({"width": size+"px"}, { queue: false, duration: 500, 
     complete : function() { 
     $('#map').css('cursor','pointer'); 
      } 
    }); 

它应该是这样，如果我理解正确的。

Answer 4

$(this).animate({ 
    "left": left+"px", 
    "top": top+"px", 
    "height": size+"px", 
    "width": size+"px" 
},{ 
    queue: false, 
    duration: 500, 
    complete: function(){ 
    $('#map').css('cursor','pointer'); 
    } 
});