jQuery中的动画
时间：2011-04-05 来源：小山丘
show(param)和hide(param)方法
$("element").hide() 的效果和 $("element").css("display", "none") 效果相同。
注意在hide()方法将"内容"的display属性值设置为"none"之前，会记住原先的display属性值。
参数：param 可选。 "slow"(0.6),"normal"(0.4), "fast"(0.2)或者时间以毫秒为单位。
hide()方法减少内容的高度，宽度和不透明度，然后再将display设置为"none"。
fadeIn()和fadeOut()方法
fadeIn()方法增加元素的不透明度(淡入)，fadeOut()方法减少元素的不透明度(淡出)。
slideUp()和slideDown()方法
slideUp()方法减少元素的高度，slideDown()方法增加元素的不高度。
自定义动画方法animate
animate(params, speed, callback);
参数说明：
params: 一个包含样式属性及值的映射，比如{property1:"values1", property2:"values2",...}.
speed: 速度参数，可选。
callback:在动画完成时执行的函数，可选。
在3秒内向左移动到500px;
$(function(){
$("#panel1").click(function(){
$(this).animate({left: "500px"}, 3000);
})
})
在3秒内相对自身向左移动了500px;
$(function(){
$("#panel1").click(function(){
$(this).animate({left : "+=500px"}, 3000);
})
多重动画
1，同时执行多个动画
$(function(){
$("#myImg").click(function(){
$(this).animate({left : "500px", height : "200px"}, 3000);
});
})
效果：元素在向右滑动的同时，放大元素的高度。
$("#myImg").click(function(){
$(this).animate({left : "500px"}, 3000).
animate({
});
})
动画完成后的回调函数
比如调用css函数: $(this).css("border", "5px solid blue");
停止动画和判断是否处于动画状态
stop([clearQueue], [gotoEnd]),参数clearQueue和gotoEnd都是可选的参数。为boolean值。（解决动画队列的问题）
clearQueue：是否要清空未执行完的动画队列。
gotoEnd：代表是否直接将正在执行的动画跳转到末状态。
$(element),is(":animated") 判断元素是否处于动画状态。
相关阅读 更多 +
