JQuery三-动画

JQuery动画效果

JQuery中封装了很多动画效果，如显示隐藏、滑动、淡入淡出、自定义动画等。

1. 显示隐藏

一般用的时候都很少带参数，直接显示或者隐藏即可。

• show([speed, [easing], [fn]])

• hide([speed, [easing], [fn]])

• toggle([speed, [easing], [fn]])

2. 滑动效果

• 下滑slideDown([speed, [easing], [fn]])
• 上滑slideUp([speed, [easing], [fn]])
• 滑动切换slideToggle([speed, [easing], [fn]])

3. 事件切换

hover([over,]out)

over: 鼠标移动到元素上触发的函数

out：鼠标移出元素要触发的函数

但是多次触发会造成动画或者效果排队执行，引入停止排队stop

stop(): 停止动画或者效果

4. 淡入淡出效果

• fadeIn([speed, [easing], [fn]])
• fadeOut([speed, [easing], [fn]])
• fadeToggle([speed, [easing], [fn]])
• fadeTo([[speed],opacity, [easing], [fn]])修改透明度

5. 自定义动画animate

animate(params, [speed], [easing], [fn])