jQuery学习笔记6——自定义动画方法animate() 二
现在我们使用animate()方法实现一个综合的动画效果。
单击<div>后让它向右移动的同时增大它的高度，并且将它的不透明度从100%变换成50%，然后再让它从上到下移动，同时宽度变大，不透明度又从50%变换成100%，当这些效果完成后，再把它的边框变成{borer:5px solid bule;}
Code
$(我们也可以使用animate()方法中的回调函数参数来实现这样的效果。只需改为：
<script language="javascript">
$(function(){
$("#panel").css("opacity","1");
$("#panel").click(function(){ $(this).animate({left:"+=500px",height:"300px",opacity:"0.5"},3000) .animate({top:"300",width:"300px",opacity:"1"},3000,function(){ $(this).css("border","5px solid blue")
}) });
})</script>.css()方法不会加入到动画队列中，所以使用回调函数对非动画方法实现排队。
动画队列
1)一组元素上的动画效果
当在一个animate()方法中应用多个属性时，动画是同时发生的。
当以链式的写法应用动画方法时，动画是按照顺序发生的。
2)多组元素上的动画效果
默认情况下，动画都是同时发生的。
当以回调的形式应用动画方式时，动画是按照回调顺序发生的。
另外，在动画方法中，要注意其他动画方法会插队，例如css()方法要使用非动画方法也按照顺充执行，需要把这些方法写在动画方法的回调函数中。
