jQuery的使用--效果

1.隐藏显示效果

 隐藏/显示：

如果点击“隐藏”按钮，我就会消失。
隐藏
显示

通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法

$(document).ready(function(){
  $("button").click(function(){
  $("p").toggle();
  });
});

2.淡入淡出的效果

 fadeIn()淡入、fadout()淡出、fadeToggle()切换

演示带有不同参数的 fadeToggle() 方法。
点击这里，使三个矩形淡入淡出

3.收缩效果

slideDown():展开     slideUp():收起  slideToggle():展开或者收起

 




jQuery是一个很好用的框架
多多使用这个框架

请点击这里

4.动画效果

 $(selector).animate({params},speed,callback);

  必需的 params 参数定义形成动画的 CSS 属性。
 可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

 可选的 callback 参数是动画完成后所执行的函数名称

比如：

 
 

开始动画
默认情况下，所有 HTML 元素的位置都是静态的，并且无法移动。
如需对位置进行操作，记得首先把元素的 
CSS position 属性设置为 relative、fixed 或 absolute。

5.停止动画

 $(selector).stop(stopAll,goToEnd);

可选的 stopAll 参数规定是否应该清除动画队列。默认是 false，
           即仅停止活动的动画，允许任何排入队列的动画向后执行。

可选的 goToEnd 参数规定是否立即完成当前动画。默认是 false  

6. Chaining多个效果可以叠加

比如：$("#pannel").css("color","red").slideUp(2000).slideDown(2000);