jQuerty使用animate的callback立刻发生了

在w3School上这这么写的

定义和用法

animate() 方法执行 CSS 属性集的自定义动画。

该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的,这样就可以创建动画效果。

jQuery 动画 - animate() 方法

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,学的并不深入,如果有什么地方理解错了,希望能指点一下我。

 

posted @ 2015-11-05 20:53  咔佧  阅读(624)  评论(0编辑  收藏  举报