jQuery hide() 和 show()
通過 jQuery嚎莉，您可以使用 hide() 和 show() 方法來隱藏和顯示 HTML 元素
語法:
$(selector).hide(speed,callback);
$(selector).show(speed,callback);
可選的 speed 參數(shù)規(guī)定隱藏/顯示的速度臂聋，可以取以下值："slow"氓轰、"fast" 或毫秒臼婆。
可選的 callback 參數(shù)是隱藏或顯示完成后所執(zhí)行的函數(shù)名稱丁频。
下面的例子演示了帶有 speed 參數(shù)的 hide() 方法：
實(shí)例
$("button").click(function(){
$("p").hide(1000);
});
jQuery toggle()
通過 jQuery按声，您可以使用 toggle() 方法來切換 hide() 和 show() 方法裹粤。
顯示被隱藏的元素终蒂，并隱藏已顯示的元素：
實(shí)例
$("button").click(function(){
$("p").toggle();
});
語法:
$(selector).toggle(speed,callback);
可選的 speed 參數(shù)規(guī)定隱藏/顯示的速度，可以取以下值："slow"遥诉、"fast" 或毫秒拇泣。
可選的 callback 參數(shù)是隱藏或顯示完成后所執(zhí)行的函數(shù)名稱。
對于可選的 callback 參數(shù)矮锈，有以下兩點(diǎn)說明：
1.$(selector)選中的元素的個(gè)數(shù)為n個(gè)霉翔，則callback函數(shù)會(huì)執(zhí)行n次；
2.callback函數(shù)名后加括號愕难，會(huì)立刻執(zhí)行函數(shù)體早龟，而不是等到顯示/隱藏完成后才執(zhí)行惫霸；
3.callback既可以是函數(shù)名，也可以是匿名函數(shù)葱弟；
jQuery 效果 - 淡入淡出
通過 jQuery壹店，您可以實(shí)現(xiàn)元素的淡入淡出效果。
jQuery Fading 方法
通過 jQuery芝加，您可以實(shí)現(xiàn)元素的淡入淡出效果硅卢。
jQuery 擁有下面四種 fade 方法：
fadeIn()
fadeOut()
fadeToggle()
fadeTo()
jQuery fadeIn() 方法
jQuery fadeIn() 用于淡入已隱藏的元素。
語法:
$(selector).fadeIn(speed,callback);
可選的 speed 參數(shù)規(guī)定效果的時(shí)長藏杖。它可以取以下值："slow"将塑、"fast" 或毫秒。.
可選的 callback 參數(shù)是 fading 完成后所執(zhí)行的函數(shù)名稱蝌麸。
下面的例子演示了帶有不同參數(shù)的 fadeIn() 方法：
實(shí)例
$("button").click(function(){
$("#div1").fadeIn();
$("#div2").fadeIn("slow");
$("#div3").fadeIn(3000);
});
jQuery fadeOut() 方法
jQuery fadeOut() 方法用于淡出可見元素点寥。
語法:
$(selector).fadeOut(speed,callback);
可選的 speed 參數(shù)規(guī)定效果的時(shí)長。它可以取以下值："slow"来吩、"fast" 或毫秒敢辩。
可選的 callback 參數(shù)是 fading 完成后所執(zhí)行的函數(shù)名稱。
下面的例子演示了帶有不同參數(shù)的 fadeOut() 方法：
實(shí)例
$("button").click(function(){
$("#div1").fadeOut();
$("#div2").fadeOut("slow");
$("#div3").fadeOut(3000);
});
jQuery fadeToggle() 方法
jQuery fadeToggle() 方法可以在 fadeIn() 與 fadeOut() 方法之間進(jìn)行切換弟疆。
如果元素已淡出戚长，則 fadeToggle() 會(huì)向元素添加淡入效果。
如果元素已淡入怠苔，則 fadeToggle() 會(huì)向元素添加淡出效果同廉。
語法:
$(selector).fadeToggle(speed,callback);
可選的 speed 參數(shù)規(guī)定效果的時(shí)長。它可以取以下值："slow"柑司、"fast" 或毫秒迫肖。
可選的 callback 參數(shù)是 fading 完成后所執(zhí)行的函數(shù)名稱。
下面的例子演示了帶有不同參數(shù)的 fadeToggle() 方法：
實(shí)例
$("button").click(function(){
$("#div1").fadeToggle();
$("#div2").fadeToggle("slow");
$("#div3").fadeToggle(3000);
});
jQuery fadeTo() 方法
jQuery fadeTo() 方法允許漸變?yōu)榻o定的不透明度（值介于 0 與 1 之間）帜羊。
語法:
$(selector).fadeTo(speed,opacity,callback);
必需的 speed 參數(shù)規(guī)定效果的時(shí)長咒程。它可以取以下值："slow"鸠天、"fast" 或毫秒讼育。
fadeTo() 方法中必需的 opacity 參數(shù)將淡入淡出效果設(shè)置為給定的不透明度（值介于 0 與 1 之間）。
可選的 callback 參數(shù)是該函數(shù)完成后所執(zhí)行的函數(shù)名稱稠集。
下面的例子演示了帶有不同參數(shù)的 fadeTo() 方法：
實(shí)例
$("button").click(function(){
$("#div1").fadeTo("slow",0.15);
$("#div2").fadeTo("slow",0.4);
$("#div3").fadeTo("slow",0.7);
});
jQuery 效果 - 滑動(dòng)
jQuery 滑動(dòng)方法可使元素上下滑動(dòng)奶段。
jQuery 滑動(dòng)方法
通過 jQuery，您可以在元素上創(chuàng)建滑動(dòng)效果剥纷。
jQuery 擁有以下滑動(dòng)方法：
slideDown()
slideUp()
slideToggle()
jQuery slideDown() 方法
jQuery slideDown() 方法用于向下滑動(dòng)元素痹籍。
語法:
$(selector).slideDown(speed,callback);
可選的 speed 參數(shù)規(guī)定效果的時(shí)長。它可以取以下值："slow"晦鞋、"fast" 或毫秒蹲缠。
可選的 callback 參數(shù)是滑動(dòng)完成后所執(zhí)行的函數(shù)名稱棺克。
下面的例子演示了 slideDown() 方法：
實(shí)例
$("#flip").click(function(){
$("#panel").slideDown();
});
jQuery slideUp() 方法
jQuery slideUp() 方法用于向上滑動(dòng)元素。
語法:
$(selector).slideUp(speed,callback);
可選的 speed 參數(shù)規(guī)定效果的時(shí)長线定。它可以取以下值："slow"娜谊、"fast" 或毫秒。
可選的 callback 參數(shù)是滑動(dòng)完成后所執(zhí)行的函數(shù)名稱斤讥。
下面的例子演示了 slideUp() 方法：
實(shí)例
$("#flip").click(function(){
$("#panel").slideUp();
});
jQuery slideToggle() 方法
jQuery slideToggle() 方法可以在 slideDown() 與 slideUp() 方法之間進(jìn)行切換纱皆。
如果元素向下滑動(dòng)，則 slideToggle() 可向上滑動(dòng)它們芭商。
如果元素向上滑動(dòng)派草，則 slideToggle() 可向下滑動(dòng)它們。
$(selector).slideToggle(speed,callback);
可選的 speed 參數(shù)規(guī)定效果的時(shí)長铛楣。它可以取以下值："slow"近迁、"fast" 或毫秒。
可選的 callback 參數(shù)是滑動(dòng)完成后所執(zhí)行的函數(shù)名稱簸州。
下面的例子演示了 slideToggle() 方法：
實(shí)例
$("#flip").click(function(){
$("#panel").slideToggle();
});
jQuery 效果- 動(dòng)畫
jQuery 動(dòng)畫 - animate() 方法
jQuery animate() 方法用于創(chuàng)建自定義動(dòng)畫钳踊。
語法：
$(selector).animate({params},speed,callback);
必需的 params 參數(shù)定義形成動(dòng)畫的 CSS 屬性。
可選的 speed 參數(shù)規(guī)定效果的時(shí)長勿侯。它可以取以下值："slow"拓瞪、"fast" 或毫秒。
可選的 callback 參數(shù)是動(dòng)畫完成后所執(zhí)行的函數(shù)名稱助琐。
下面的例子演示 animate() 方法的簡單應(yīng)用祭埂。它把 <div> 元素往右邊移動(dòng)了 250 像素：
實(shí)例
$("button").click(function(){
$("div").animate({left:'250px'});
});
默認(rèn)情況下，所有 HTML 元素都有一個(gè)靜態(tài)位置兵钮，且無法移動(dòng)蛆橡。
如需對位置進(jìn)行操作，要記得首先把元素的 CSS position 屬性設(shè)置為 relative掘譬、fixed 或 absolute泰演！
jQuery animate() - 操作多個(gè)屬性
請注意，生成動(dòng)畫的過程中可同時(shí)使用多個(gè)屬性：
實(shí)例
$("button").click(function(){
$("div").animate({
left:'250px',
opacity:'0.5',
height:'150px',
width:'150px'
});
});
可以用 animate() 方法來操作所有 CSS 屬性嗎葱轩？
是的睦焕，幾乎可以！不過靴拱，需要記住一件重要的事情：當(dāng)使用 animate() 時(shí)垃喊，必須使用 Camel 標(biāo)記法書寫所有的屬性名，比如袜炕，必須使用 paddingLeft 而不是 padding-left本谜，使用 marginRight 而不是 margin-right，等等偎窘。
同時(shí)乌助，色彩動(dòng)畫并不包含在核心 jQuery 庫中溜在。
如果需要生成顏色動(dòng)畫妓灌，您需要從 jquery.com 下載 顏色動(dòng)畫 插件甜孤。
jQuery animate() - 使用隊(duì)列功能
默認(rèn)地惯殊，jQuery 提供針對動(dòng)畫的隊(duì)列功能荧缘。
這意味著如果您在彼此之后編寫多個(gè) animate() 調(diào)用贴捡，jQuery 會(huì)創(chuàng)建包含這些方法調(diào)用的"內(nèi)部"隊(duì)列橡庞。然后逐一運(yùn)行這些 animate 調(diào)用挪丢。
jQuery 停止動(dòng)畫
jQuery stop() 方法
jQuery stop() 方法用于停止動(dòng)畫或效果捐迫，在它們完成之前登刺。
stop() 方法適用于所有 jQuery 效果函數(shù)籽腕，包括滑動(dòng)、淡入淡出和自定義動(dòng)畫纸俭。
語法:
$(selector).stop(stopAll,goToEnd);
可選的 stopAll 參數(shù)規(guī)定是否應(yīng)該清除動(dòng)畫隊(duì)列皇耗。默認(rèn)是 false，即僅停止活動(dòng)的動(dòng)畫揍很，允許任何排入隊(duì)列的動(dòng)畫向后執(zhí)行郎楼。
可選的 goToEnd 參數(shù)規(guī)定是否立即完成當(dāng)前動(dòng)畫。默認(rèn)是 false窒悔。
因此呜袁，默認(rèn)地，stop() 會(huì)清除在被選元素上指定的當(dāng)前動(dòng)畫简珠。
下面的例子演示 stop() 方法阶界，不帶參數(shù)：
實(shí)例
$("#stop").click(function(){
$("#panel").stop();
});
jQuery Callback 方法
Callback 函數(shù)在當(dāng)前動(dòng)畫 100% 完成之后執(zhí)行。
jQuery 動(dòng)畫的問題
許多 jQuery 函數(shù)涉及動(dòng)畫聋庵。這些函數(shù)也許會(huì)將 speed 或 duration 作為可選參數(shù)膘融。
例子：$("p").hide("slow")
speed 或 duration 參數(shù)可以設(shè)置許多不同的值，比如 "slow", "fast", "normal" 或毫秒祭玉。
實(shí)例
以下實(shí)例在隱藏效果完全實(shí)現(xiàn)后回調(diào)函數(shù):
使用 callback 實(shí)例
$("button").click(function(){
$("p").hide("slow",function(){
alert("段落現(xiàn)在被隱藏了");
});
});
以下實(shí)例沒有回調(diào)函數(shù)氧映，警告框會(huì)在隱藏效果完成前彈出：
沒有 callback(回調(diào))
$("button").click(function(){
$("p").hide(1000);
alert("段落現(xiàn)在被隱藏了");
});
jQuery - 鏈(Chaining)
通過 jQuery，可以把動(dòng)作/方法鏈接在一起脱货。
Chaining 允許我們在一條語句中運(yùn)行多個(gè) jQuery 方法（在相同的元素上）岛都。
jQuery 方法鏈接
直到現(xiàn)在，我們都是一次寫一條 jQuery 語句（一條接著另一條）蹭劈。
不過疗绣，有一種名為鏈接（chaining）的技術(shù)，允許我們在相同的元素上運(yùn)行多條 jQuery 命令铺韧，一條接著另一條。
提示： 這樣的話缓淹，瀏覽器就不必多次查找相同的元素哈打。
如需鏈接一個(gè)動(dòng)作塔逃，您只需簡單地把該動(dòng)作追加到之前的動(dòng)作上。
下面的例子把 css()料仗、slideUp() 和 slideDown() 鏈接在一起湾盗。"p1" 元素首先會(huì)變?yōu)榧t色，然后向上滑動(dòng)立轧，再然后向下滑動(dòng)：
實(shí)例
$("#p1").css("color","red").slideUp(2000).slideDown(2000);
