显示隐藏
1、显示：show()，参数----毫秒值、slow（600ms）、 normal（400ms）、 fast（200ms）
2、隐藏：hide()，参数-----毫秒值、slow（600ms）、 normal（400ms）、 fast（200ms）
3、回调函数：show(2000,function(){})、hide(2000,function(){})
4、切换：toggle()
5、控制属性：width、height、opacity、display
滑入滑出
1、滑入：slideDown()，参数----毫秒值、slow（600ms）、 normal（400ms）、 fast（200ms）
2、滑出：slideUp()，参数-----毫秒值、slow（600ms）、 normal（400ms）、 fast（200ms）
3、回调函数：slideDown(2000,function(){})、slideUp(2000,function(){})
4、切换：slideToggle()
5、控制属性：height、display
淡入淡出
1、淡入：fadeIn()，参数----毫秒值、slow（600ms）、 normal（400ms）、 fast（200ms）
2、淡出：fadeOut()，参数-----毫秒值、slow（600ms）、 normal（400ms）、 fast（200ms）
3、回调函数：slideDown(2000,function(){})、slideUp(2000,function(){})
4、切换：fadeToggle()
5、指定透明度：fadeTo(1000,0.5,,function(){})
6、控制属性值：display、opacity
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Title</title> ???<script src="jquery-1.11.1.js"></script> ???<style> ???????.box1 { ???????????width: 600px; ???????????height: 600px; ???????????border: 1px solid #ccc; ???????????margin-right: 10px; ???????????position: relative; ???????} ???????.box2 { ???????????width: 150px; ???????????height: 150px; ???????????background-color: red; ???????????position: absolute; ???????????right: 0; ???????????bottom: 0; ???????????display: none; ???????} ???</style> ???<script src="jquery-1.11.1.js"></script> ???<script> ???????$(function () { ???????????$("button").click(function () { ???????????????$(".box2").slideToggle(); ???????????}); ???????}); ???</script></head><body><button>滑入</button><div class="box1"> ???<div class="box2"></div></div></body></html>jQuery——动画效果
原文地址：http://www.cnblogs.com/wuqiuxue/p/8032252.html