可以使用 hide() 和 show() 方法来隐藏和显示元素

格式：

$(selector).hide(speed,callback)
$(selector).show(speed,callback)

其中speed为可选，表示隐藏/显示的速度，可以取值：“slow”,"fast"或者毫秒。

其中callback参数也是可选的，表示隐藏/显示完成后所执行的函数名称。

例子：

//点击button后，在1000毫秒内，隐藏所有p标签
$("button").click(function(){
    $("p").hide(1000); 
});

//点击button后，在1000毫秒内，显示所有p标签，并且弹出"已显示"
$("button").click(function(){
	$("p").show(1000,function(){
		alert("已显示！");
    }); 
});

fadeIn() 用于淡入已隐藏的元素

fadeOut() 方法用于淡出可见元素。

格式：

$(selector).fadeIn(speed,callback)

其中speed为可选，表示淡入效果的时长，可以取值：“slow”,"fast"或者毫秒。

其中callback参数也是可选的，表示淡入效果完成后所执行的函数名称。

格式：

$(selector).fadeOut(speed,callback)

其中speed为可选，表示淡出效果的时长，可以取值：“slow”,"fast"或者毫秒。

其中callback参数也是可选的，表示淡出效果完成后所执行的函数名称。

例子：

// 点击button后，id为div3的元素在3000毫秒内淡入
$("button").click(function(){
    $("#div3").fadeIn(3000); 
});

// 点击button后，id为div2的元素在3000毫秒内淡出，并且淡出后弹出"fadeOut"
$("button").click(function(){
    $("#div2").fadeOut("3000"，function(){        
          alert("fadeOut");
     });
  });

slideDown() 方法用于向下滑动元素。

slideUp() 方法用于向上滑动元素。

格式：

$(selector).slideDown(speed,callback)

其中speed为可选，表示向下滑动效果的时长，可以取值：“slow”,"fast"或者毫秒。

其中callback参数也是可选的，表示滑动效果完成后所执行的函数名称。

格式：

$(selector).slideUp(speed,callback)

其中speed为可选，表示向上滑动效果的时长，可以取值：“slow”,"fast"或者毫秒。

其中callback参数也是可选的，表示滑动效果完成后所执行的函数名称。

例子：

//点击button后，在1000毫秒内，隐藏所有p标签
$("button").click(function(){
    $("p").hide(1000); 
});

//点击button后，在1000毫秒内，显示所有p标签，并且弹出"已显示"
$("button").click(function(){
	$("p").show(1000,function(){
		alert("已显示！");
    }); 
});

animate() 方法用于创建自定义动画。

格式：

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

params 参数定义形成动画的CSS属性。

speed 参数为可选，表示效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

callback参数为可选，表示动画完成后所执行的函数名称。

例子：

//点击button后，把div元素移动到左边，直到left属性等于250px为止；
$("button").click(function(){
    $("div").animate({left:'250px'});   
}); 

操作多个属性

//点击button后，把div元素移动到左边，直到left属性等于250px为止，
//透明度变成0.5，且高度宽度都变成150px；
$("button").click(function(){  
	$("div").animate({
        left:'250px',
        opacity:'0.5',
        height:'150px',
        width:'150px'
	});
});

stop() 方法用于停止动画或效果，在它们完成之前。

stop() 方法适用于所有 jQuery 效果函数，包括滑动、淡入淡出和自定义动画。

格式：

$(selector).stop(stopAll,goToEnd)

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

goToEnd参数为可选，表示是否立即完成当前动画。默认是false。

例子：

//点击id为flip元素时，id为panel元素向下滑动,持续时间为5000;
$("#flip").click(function(){
    $("#panel").slideDown(5000);   
});

//点击id为stop元素，id为panel元素的向下滑动效果立刻停止
$("#stop").click(function(){
    $("#panel").stop();             
});