animate() 方法执行 CSS 属性集的自定义动画。
该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的，这样就可以创建动画效果。
jQuery animate() 方法用于创建自定义动画。
$(selector).animate({params},speed,callback);
必需的 params 参数定义形成动画的 CSS 属性。
可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是动画完成后所执行的函数名称。
然后我想弄一个切换图片并且有渐入渐出的动画效果
var imgIndex = $(this).index() + 1;
$(".mainImg img").animate({ opacity: "0.1" }, 600,toggleImg(imgIndex ) })
.animate({ opacity: "1" }, 400);
function toggleImg(imgIndex)
{
$(".mainImg img").attr("src", "App_Imgs/active0" + imgIndex + ".jpg");
}
结果是传入的imgIndex显示undenfind，并且代码是马上执行的，并没有等待动画结束。然后改成这样
$(".mainImg img").animate({ opacity: "0.1" }, 600,function () {
$(".mainImg img").attr("src", "App_Imgs/active0" + imgIndex + ".jpg"); }).animate({ opacity: "1" }, 400);
就可以了 感觉是因为本函数是调用函数，所以 imgIndex没有销毁可以继续使用。
初学jQuerty和js，学的并不深入，如果有什么地方理解错了，希望能指点一下我。
jQuerty使用animate的callback立刻发生了
原文：http://www.cnblogs.com/xshaobaozi/p/4940770.html