背景jQuery提供了JS未能提供的动画效果，利用jQuery的动画效果，可以极大的简化JS动画部分的逻辑滑入滑出动画- 滑入动画
定义：以下拉方式动画效果将html内容显示出来
使用方式：
$(selector).slideDown(time,function)
$(selector).slideDown(2000)
$(selector).slideDown()
$(selector).slideDown(fast/normal/slow)
time代表执行动画的时间，function代表动画执行完之后所要执行的函数
- 滑出动画
定义：以上滑方式动画效果将html内容隐藏出来
使用方式：
$(selector).slideUp(time,function)
$(selector).slideUp(2000)
$(selector).slideUp()
$(selector).slideUp(fast/normal/slow)
time代表执行动画的时间，function代表动画执行完之后所要执行的函数
- 滑入滑出切换动画
定义：在滑入滑出动画间切换
使用方式：
$(selector).slideToggle(time,function)
$(selector).slideToggle(2000)
$(selector).slideToggle()
$(selector).slideToggle(fast/normal/slow)
淡入淡出动画- 淡入动画
作用：让元素以淡淡的进入视线的方式展现出来
使用方式
$(selector).fadeIn(time,function)
$(selector).fadeIn(2000)
$(selector).fadeIn()
$(selector).fadeIn(fast/normal/slow)
- 淡出动画
作用：让元素以淡淡的离开视线的方式隐藏起来
使用方式
$(selector).fadeOut(time,function)
$(selector).fadeOut(2000)
$(selector).fadeOut()
$(selector).fadeOut(fast/normal/slow)
- 淡入淡出切换动画
作用：让元素在淡入淡出动画切换
使用方式
$(Selector).fadeToggle(time,function)
$(selector).fadeToggle(2000)
$(selector).fadeToggle()
$(selector).fadeToggle(fast/normal/slow)
- 修改opacity
作用： 修改opacity的值
使用方式
$(Selector).fadeTo(time,opacity,function)
time可以是字符串，可以是具体数字
也可只有参数一、参数二
显示隐藏动画- 显示动画
作用： 将Html结构显现出来
使用方式
$(Selector).show(time，function)
$(selector).show(2000)
$(selector).show()
$(selector).show(fast/normal/slow)
- 隐藏动画
作用： 将Html结构隐藏起来
使用方式
$(Selector).hide(time，function)
$(selector).hide(2000)
$(selector).hide()
$(selector).hide(fast/normal/slow)
停止动画- 定义：停止正在执行的动画
- 使用方式：
$(selector).stop()
stop()中可以有两个参数，参数一：后续动画是否执行，参数二：当前动画是否执行完毕，默认的是（false,false),注意第一个参数，true代表的是后续动画不执行
————————————————————————————
第一种:(false，false)
后续动画会执行，当前动画不会执行完
第二种:(false，true)
后续动画会执行，当前动画会执行完
第三种:(true，false)
后续动画不会执行，当前动画不会执行完
第四种:(true，true)
后续动画不会执行，当前动画会执行完
自定义动画- 作用：执行一组CSS属性的自定义动画
- 使用方式：
$(selector).animate({CSS定义},time,function())
阅读全文
|
