JQuery中有三种基础的动画，分别是：显示（show）与隐藏（hide）与切换（toggle）、滑入（ slideDown）与滑出（ slidell）与切换（ slide Toggle），效果与卷帘门类似、谈入 faden）与淡出 （fadeOut）与切换（fade Toggle）。
首先是显示（show）与隐藏（hide）与切换（toggle），三种方法的用法是类似的。就简单说一下关于show()的用法。
1、show（），可以添加两个参数。
第一个参数：代表执行动画的时长（毫秒数）也可以是代表时长的字符串（fast、normal和slow）[fast代表的200毫秒，normal代表的事400毫秒，slow代表的事600毫秒]。
第二个参数：代表动画执行完毕后的回调函数。也就是在动画执行结束之后想要执行的样式等操作。
注意：
1、如果show（）方法中没有参数，就没有动画效果。
2、如果代表时长的单词写错了，就相当于写了一个normal，
3、关于toggle，如果元素是隐藏状态，执行之后就是显示状态，如果是显示状态执行之后就是隐藏状态。
关于hide和toggle的用法，和show的用法基本差不多。
关于运行效果，可以自己试验一次。
其次是滑入（ slideDown）与滑出（ slidell）与切换（ slide Toggle）。其用法和show的用法差不多，但是有些不一样的注意事项：
- 动态效果从下至上。竖向动作，slideToggle 通过高度变化来切换所有匹配元素的可见性
- .slideDown()，下拉动画，初始状态应为display:none
- .slideUp( ) 上卷动画，参数解释在文章开头
- .slideToggle( ) 下拉上卷的切换动画
最后关于谈入 faden）与淡出 （fadeOut）与切换（fade Toggle）。其用法和show的用法也差不多，也有一些注意事项：
- 隐藏的元素，display:none，不会在影响页面的布局
- .fadeOut( ) 淡出动画 opacity=>1-0
- .fadeIn( ) 淡入动画 opacity=>0-1
- .fadeToggle( ) 淡入淡出动画切换
- .fadeTo（）opactiy => start-endOpacity
最后有一个自定义动画animate（）
包含四个参数：
第一个参数：必选的 对象， 代表的事需要做动画的属性
第二个参数：可选的，代表动画执行的时长
第三个参数：可选的，easing，代表是缓动还是匀速，【linear(匀速)，swing（缓动），默认不写是缓动。】
第四个参数：动画执行之后的回调函数
/*实现div在页面尚横向飘动的效果*/ <style> #cube{ position:relative;/* 不加这句元素不能动 */ width:30px; height:30px; background:red; cursor:pointer; } </style> <body> <div> <div id="cube"></div> </div> <script> $(function(){ $("#cube").click(function(){ $(this).animate({left:"100px"},2000) }) }) </script>
