Animate对象是一个我们经常使用的Jquery对象，他可以帮助我们快速的实现过渡效果，覆盖了绝大多数的属性。

语法：

$("元素").animate({过渡属性:过渡值},过渡时间,完成后的回调函数);

下面介绍下用法：

1.单属性改变实例：让class名称为test的元素，在500毫秒内往右移动500像素，完成后弹出完成对话框。

$(".test").animate({marginLeft:"500px"},
	500,
	function(){
		alert("完成");
	});

2.多属性改变实例：让class名称为test的元素，在500毫秒内往右移动500像素，高度变为500同时透明度变为0.5，完成后弹出完成对话框。

$(".test").animate({marginLeft:"500px",
	height:"500px",
	opacity:0.5
	},
	500,
	function(){
		alert("完成");
	});

3.多属性，多改变实例：让class名称为test的元素，在500毫秒内往右移动500像素，高度变为500同时透明度变为0.5，完成后再将其透明度变为1，宽度变为500，最后完成后弹出完成对话框

$(".test").animate({marginLeft:"500px",
	height:"500px",
	opacity:0.5
	},
	500,
	function(){
		$(this).animate({opacity:1,
		width:"500px"
		},
		500,
		function(){
			alert("完成");
		});
	});

4.注意：

在使用animate对象，特别是多种效果叠加使用时，我们一定要注意判断对象的运动状态，否则很容易出现bug，导致过渡效果和你预想的完全不一样。

判断元素是否正在运动状态：

if($(".test").is(":animated")){ 
	  //正在运动状态
    }else{
	  //非运动状态
	}

停止当前元素的动画：

$(".test").stop();