jQuery 动画效果:
- jQuery动画的分类:效果不同用法一致。
- 基本动画效果:既有透明渐变,又有滑动效果。
- 滑动动画函数:仅使用滑动动画的效果。
- 渐入渐出动画效果。仅使用透明渐变的效果。
基本动画函数:
- 基本动画函数主要包括:show() ,hide() ,toggle ();无参数状态表示不适用动画切换元素的显示状态,**当传递参数的时候表示在多少事件内执行完动画的效果。传递的参数可以为毫秒是数或者是预定义的英文字符串。**
滑动动画函数:Sliding
- 名称 | 说明 | 举例 |
- SlideDown(speed,[callback]) | 通过高度的变化实现滑动的动画效果 | $("p").slideDown("slow"):以600毫秒的速度将段落缓缓的滑下。
- slideUp(speed,[ callback]) | 通过高度的变化实现向上隐藏所匹配的元素, | $("p').slideUp("slow"):以600毫秒的速度将段落收上:
- slideToggle(speed ,【callback】) 转换两者之间的变换状态。 | $("p").slideToggle("slow"): 以600毫秒的速度将段落滑上或者滑下。
淡入淡出效果函数:Fading
- 名称 | 说明 | 举例
- fadeIn (speed, 【callback】), | 通过改变元素的不透明效果的程度来不改变元素的大小 | $("p").fadeIn("speed"): 600毫秒淡入;
- fadeOut (speed,[calback]),| 同上 | $("p").fadeOut("slow"); 600 毫秒执行淡出效果。
- fadeTo (speed,opacity ,【callback】) | 所有匹配的元素以渐进的方式执行制定的不透明度的大小。 *opacity 参数值范围是0-1 透明度 0.6 表示透明度60% *
自定义动画效果。
- 自定义函数Custom
- animate( params ,[duartion] ,[easing] ,[callback]) :params :实现动画的个数(可选) ,duartion:实现动画的事件(可选); easing:需要的插件支持(可选)。
- animate ( params , options):options :一组包含动画选项值的集合。
支持的格式如下:
- duration: 与上面的 duration 参数相同
- easing: 与上面的 easing 参数相同
- complete :类型为 Function, 在动画完成时执行的函数
- step: Callback
- queue (Boolean): (默认值: true) 设定为 false 将使此动画不进入动画队列
全局控制属性:
jQuery.fx.off = true; 关闭所有jQuery动画效果。
0
学习时间 86分钟
操作时间 9分钟
按键次数 10次
实验次数 2次
报告字数 1402字
是否完成 完成
