一、show()方法和hide()方法
1.show()与hide()
show()：根据hide()方法记住的display属性值来显示元素。
hide() : 将该元素的display样式改为 “none”。
2.参数让元素动起来：
调用show()和hide()相当于css(“display”,“none/block/inline”),不会有任何动画。如果希望调用元素慢慢显示/消失，则可以为show()/hide()方法指定一个速度参数.
参数：slow,normal,fast,数值（以毫秒为单位）
$("element").show("slow"); //元素将在600毫秒内慢慢地显示出来
$("element").show("normal"); //元素将在400毫秒内慢慢地显示出来
$("element").show("fast"); //元素将在200毫秒内慢慢地显示出来
$("element").hide("1000"); //元素将在1000毫秒(1秒)内慢慢地隐藏
注意：对元素使用带参数的show()和hide()是从：高度，宽度，不透明度 三个属性同时进行操作的。
二、fadeIn()方法和fadeOut()方法
fadeIn()/fadeOut() 只改变元素的不透明度。
1.fadeOut() ：会在指定的一段时间内降低元素的不透明度，直到元素完全消失(“display:none”)。
2.fadeIn() ：与fadeOut()完全相反。
$("#panel h5.head").toggle(function(){
$(this).next("div.content").fadeOut();
},function(){
$(this).next("div.content").fadeIn();
});
三、slideUp()方法和slideDown()方法
slideUp()/slideDown()只改变元素的高度。
1.slideDown()：如果一个元素的display属性值为"none"，当调用slideDown()时，这个元素将由上至下延伸显示。
2.slideUp() ：与slideDown()完全相反。
$("#panel h5.head").toggle(function(){
$(this).next("div.content").slideUp();
},function(){
$(this).next("div.content").slideDown();
});
四、自定义动画方法animate()
语法:animate(params, speed ,callback);
参数说明：
（1）params： 一个包含样式属性及值的映射，比如{property1: “value1”, property2: “value2”, ····· }
（2）speed : 速度参数，可选。
（3）callback:在动画完成时执行的函数，可选。
1.自定义简单动画
例当点击id="panel"的div时该div就会向右运动。
<head>
<style>
#panel{
position:relative;
width:100px;
height:100px;
border:1px solid #0050D0;
}
</style>
</head>
<div id="panel">click me</div>
<script>
$(function(){
$("#panel").click(function(){
$(this).animate({left:"500px"},3000);
});
});
</script>
2.累加、累减动画
将上例jQuery代码改为 (在500px之前加上"+=“或”-="，即表示在当前位置累加或者类减)
$(function(){
$("#panel").click(function(){
$(this).animate({left:"+=500px"},3000);
});
});