JQuery学习笔记（四）

五、动画效果

1、不使用动画效果显示和隐藏元素
主要是使用show()和hide()两个方法来实现
需要注意两点
a. JQuery主要是将display设置为none来隐藏元素的，即使包装集中的某一项已经是hide状态，它也会作为返回包装集中的内

容被返回
b. 如果显示设置了display为none，那在使用show方式时，回将display设置为block，反之，则会根据情况进行设置block或

inline

toggle()方法可以变换显示状态

2、使用动画效果显示和隐藏元素
hide(speed,callback)
speed    可以是毫秒或者预定义的slow, normal, fast
callback    当动画完成时调用的回调函数，没有参数，但是this代表运行动画的对象（元素）

show(speed,callback)
toggle(speed,callback)

3、其他的内置效果

fadeIn()     渐变进入
fadeOut()    渐变淡出
fadeOut(speed,callback)
fadeIn(speed,callback)
fadeTo(speed,opacity,callback)        opacity指定其透明度，值范围是0.0-1.0
slideDown(speed,callback)
slideUp(speed,callback)
slideToggle(speed,callback)
stop()

4、定制化自己的动画

animate(properties,duration,easing,callback)
animate(properties,options)

properties    JS对象类型，用于描述属性最后所要达到的值。除了设置数字值外，还可以设置字符值hide, show, or
toggle
duration    类似于之前的speed
easing   
callback    类似于之前的callback
options   

举个例子：
$('.animateMe').each(function(){
$(this).animate(
{
width: $(this).width() * 2,
height: $(this).height() * 2
},
2000
);
});