jQuery动画

一、动画：

1、显示和隐藏（实际是修改标签的display值）

hide（）：隐藏

show（）：显示

2、淡入淡出

fadeln（）：dispaly变为none，颜色淡入，直到完全透明；

fadeOut（）：颜色变为透明，display变为block；

fadeToggle（）：反复在淡入和淡出之间切换；

3、滑动

slideUp（）：标签从下到上收起，直到高度为0，display变为none；

slideDown（）：高度增加，display变为block；

slideToggle（）：反复在增高、变矮之间切换；

以上由jquery封装的简单动画都可以传一个参数，参数为以毫秒为单位的数值

4、自定义动画：可以使用jquery提供的animate（）方法来进行自定义动画

element.animate（p，s，c）：

p参数：包含样式属性以及属性值的对象类型数据；

s参数：动画执行的时间，可写可省；

c参数：动画执行完毕后的回调函数，当动画执行完毕后会执行作为参数传递进去的函数，任何一个动画都可以传一个函数作为回调函数，可写可省；

$('#div1').animate({width:'500px'},2000,function(){

alert('变化成功')；

}) //表示ID为div1的标签在2000毫秒内，宽度变为500；‘变化成功’将会在2000毫秒后动画执行完毕后弹出；

动画也可以同时执行多个动画（同时又多个属性值发生变化）

$(‘#div’).animate({

height : '100px',

width：'500px’

//此处同时执行宽和高的变化动画

}, 2000).animate({

//此处可使用链式语法，当上个动画执行完毕后，按顺序执行后面的多个动画

width : '100px'

}, 2000);