jQuery动画
所有参数名speed可以取"slow","fast"或毫秒
所有参数名callback意思为回调函数，在动画结束后，就执行该函数的函数体信息。
1、隐藏/显示
- hide(speed,callback); //隐藏
- show(speed,callback); //显示
- toggle(speed,callback); //切换hide()与show()的效果
2、淡出/淡入
- fadeIn(speed,callback); //淡入
- fadeOut(speed,callback); //淡出
- fadeToggle(speed,callback); //切换fadeIn()与fadeOut()的效果
- fadeTo(speed,opacity,callback) //允许渐变为给定的不透明度。opacity参数值介于0与1之间，0最透明。
3、滑动
- slideDown(speed,callback); //滑下
- slideUp(speed,callback); //滑上
- slideToggle(speed,callback); //切换sildeDown()与sildeUp()的效果
4、自定义动画
animate({params},speed,callback);
①： 默认情况下，所有的HTML元素有一个静态的位置，且是不可移动的，如需对未知进行操作，要记得首先吧元素的CSS position属性设置为relative、fixed或absolute!
举例：
$(function(){
$("button").click(function(){
$("div").animate({
left:'250px',//向右移动250像素
width:'150px',
height:'150px'
},1000);
});
});
<body>
<button>开始动画</button>
<p>我是段落</p>
<div style="background:green;height:100px;width:100px;position:absolute;"></div>
</body>
② animate()方法几乎可以可以操作所有CSS属性，需要记住一件重要的事情：当使用animate()时,必须使用Camel标记法书写所有的属性名，比如，必须使用paddimgLeft，而不是padding-left；使用marginRight，而不是margin-right等等。
③ 使用相对值 +=
4、动画队列
$(“div”).animate({hight:‘290px’},1000).fadeOut(1000);
5、停止动画
stop(stopAll,goToEnd);
stopAll参数规定是否应该清楚动画队列。默认为false。
goToEnd参数规定是否立即完成当前动画。默认为false。
举例：
<script> $(document).ready(function(){
$("#start").click(function(){
$("div").animate({left:'100px'},5000);
$("div").animate({fontSize:'3em'},5000);
});
$("#stop").click(function(){
$("div").stop();
});
$("#stop2").click(function(){
$("div").stop(true);
});
$("#stop3").click(function(){
$("div").stop(true,true);
});
});
</script>
</head>
<body>
<button id="start">开始</button>
<button id="stop">停止</button>
<button id="stop2">停止所有</button>
<button id="stop3">停止动画，但完成动作</button>
<p>点击 "开始" 按钮开始动画。</p>
<p>点击 "停止" 按钮停止当前激活的动画，但之后我们能再动画队列中再次激活。</p>
<p>点击 "停止所有" 按钮停止当前动画，并清除动画队列，所以元素的所有动画都会停止。</p>
<p>点击 "停止动画，但完成动作" 快速完成动作，并停止它。</p>
<div style="background:#98bf21;height:100px;width:200px;position:absolute;">HELLO</div>
还有一些动画的函数未写。可以参考菜鸟教程jQuery参考手册下的效果方法！
![用jQuery实现一个简易的聊天框[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)