jQuery动画

jQuery动画就是对各种动画进行封装和性能优化。

jQuery的动画分为三种：非自定义动画，自定义动画，全局动画设置。

一：非自定义动画：

1：显示，隐藏

show（），hide（），toggle（）

参数是number类型的，代表运动时间。

还有三种字符串形式的的参数：fast，slow，空字符串。分别代表200，400，600.

2：滑动

sliddeUp()

slideDown()

slideToggle() 自动

3：淡入淡出

fadeOut（）

fadeIn（）

fadeToggle（）

这个方法就是把元素的透明度从1变成0后把display的block变成none。不能改变透明度到一个特定的值；

改变透明度  fadeTo（）  有两个参数，第一个是执行时间，第二个是预期的透明度的值。

二;自定义动画

animate（）方法

animate（）方法有三个参数。第一个是动画目标，第二个是动画时间，第三个是动画的回调函数。只有第一个是必须有的。

（1）    
animate（{‘width’：100px}）

（2）
animate（{‘width’：‘+=100px’}） 累计的改变属性值。

（3）
动画执行顺序的设定

a：用回调函数

$('div').animate({

'width':'100px',

'height':'200px'

}1000,function(){

$('div').animate({

'width':'100px',

'height':'400px'

})

})

将动画效果分开写：

$('div').click(function(){

$('div').animate({

'width':'100px',

'height':'400px'

})

$('div').animate({

'width':'100px',

'height':'400px'

})

})

(3)连缀 可以不用再写目标对象

$('div').click(function(){

$('div').animate({

'width':'100px',

'height':'400px'

}).animate({

'width':'100px',

'height':'400px'

})

})