第五节:jq动画

动画效果

1. 基本效果

show([s,[e],[fn]])      显示隐藏的匹配元素
hide([s,[e],[fn]])      隐藏显示的元素
toggle([s],[e],[fn])    如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的

参数详解

speed   : 三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)
easing  : (Optional) 用来指定切换效果,默认是"swing",可用参数"linear"
fn      : 在动画完成时执行的函数,每个元素执行一次。

2. 滑动效果

slideDown([s],[e],[fn])     通过高度变化(向下增大)来动态地显示所有匹配的元素
slideUp([s,[e],[fn]])       通过高度变化(向上减小)来动态地隐藏所有匹配的元素
slideToggle([s],[e],[fn])   通过高度变化来切换所有匹配元素的可见性

参数详解

speed   : 三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)
easing  : (Optional) 用来指定切换效果,默认是"swing",可用参数"linear"
fn      : 在动画完成时执行的函数,每个元素执行一次。

3 淡入淡出效果

fadeIn([s],[e],[fn])        通过不透明度的变化来实现所有匹配元素的淡入效果
fadeOut([s],[e],[fn])       通过不透明度的变化来实现所有匹配元素的淡出效果
fadeToggle([s,[e],[fn]])    通过不透明度的变化来开关所有匹配元素的淡入和淡出效果
fadeTo([[s],o,[e],[fn]])    把所有匹配元素的不透明度以渐进方式调整到指定的不透明度

参数详解

speed   : 三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)
easing  : (Optional) 用来指定切换效果,默认是"swing",可用参数"linear"
fn      : 在动画完成时执行的函数,每个元素执行一次。

opacity : (用户fadeTo)一个0至1之间表示透明度的数字。

4 自定义动画

联系管理员微信tutu19192010,注册账号

上一篇
下一篇
Copyright © 2022 Egon的技术星球 egonlin.com 版权所有 帮助IT小伙伴学到真正的技术