jQuery控制元素顯示隱藏切換滑動的方法總結

　　jQuery 隱藏和顯示

　　通過 hide() 和 show() 兩個函數(shù)，jQuery 支持對 HTML 元素的隱藏和顯示：

　　實例

　　復制代碼 代碼如下:

　　$("#hide").click(function(){

　　$("p").hide();

　　});

　　$("#show").click(function(){

　　$("p").show();

　　});

　　hide() 和 show() 都可以設置兩個可選參數(shù)：speed 和 callback。

　　語法：

　　復制代碼 代碼如下:

　　$(selector).hide(speed,callback)

　　$(selector).show(speed,callback)

　　speed 參數(shù)規(guī)定顯示或隱藏的速度。可以設置這些值："slow", "fast", "normal" 或毫秒。

　　callback 參數(shù)是在 hide 或 show 函數(shù)完成之后被執(zhí)行的函數(shù)名稱。您將在本教程下面的章節(jié)學習更多有關 callback 參數(shù)的知識。

　　實例

　　復制代碼 代碼如下:

　　$("button").click(function(){

　　$("p").hide(1000);

　　});

　　callback 參數(shù)是在該函數(shù)完成之后被執(zhí)行的函數(shù)名稱。您將在本教程下面的章節(jié)學習更多有關 callback 參數(shù)的知識。

　　jQuery 滑動函數(shù) - slideDown, slideUp, slideToggle

　　jQuery 擁有以下滑動函數(shù)：

　　復制代碼 代碼如下:

　　$(selector).slideDown(speed,callback)

　　$(selector).slideUp(speed,callback)

　　$(selector).slideToggle(speed,callback)

　　speed 參數(shù)可以設置這些值："slow", "fast", "normal" 或毫秒。

　　callback 參數(shù)是在該函數(shù)完成之后被執(zhí)行的函數(shù)名稱。您將在本教程下面的章節(jié)學習更多有關 callback 參數(shù)的知識。

　　slideDown() 實例

　　復制代碼 代碼如下:

　　$(".flip").click(function(){

　　$(".panel").slideDown();

　　});

　　jQuery Fade 函數(shù) - fadeIn(), fadeOut(), fadeTo()

　　jQuery 擁有以下 fade 函數(shù)：

　　復制代碼 代碼如下:

　　$(selector).fadeIn(speed,callback)

　　$(selector).fadeOut(speed,callback)

　　$(selector).fadeTo(speed,opacity,callback)

　　speed 參數(shù)可以設置這些值："slow", "fast", "normal" 或 毫秒。

　　fadeTo() 函數(shù)中的 opacity 參數(shù)規(guī)定減弱到給定的不透明度。

　　callback 參數(shù)是在該函數(shù)完成之后被執(zhí)行的函數(shù)名稱。您將在本教程下面的章節(jié)學習更多有關 callback 參數(shù)的知識。

　　jQuery 自定義動畫

　　jQuery 函數(shù)創(chuàng)建自定義動畫的語法：

　　復制代碼 代碼如下:

　　$(selector).animate({params},[duration],[easing],[callback])

　　關鍵的參數(shù)是 params。它定義產(chǎn)生動畫的 CSS 屬性�？梢酝瑫r設置多個此類屬性：

　　復制代碼 代碼如下:

　　animate({width:"70%",opacity:0.4,marginLeft:"0.6in",fontSize:"3em"});

　　第二個參數(shù)是 duration。它定義用來應用到動畫的時間。它設置的值是："slow", "fast", "normal" 或毫秒。

　　實例

　　復制代碼 代碼如下:

　　$(document).ready(function(){

　　$("#start").click(function(){

　　$("#box").animate({height:300},"slow");

　　$("#box").animate({width:300},"slow");

　　$("#box").animate({height:100},"slow");

　　$("#box").animate({width:100},"slow");

　　});

　　});

　　$(selector).hide() 隱藏被選元素 $(selector).show() 顯示被選元素 $(selector).toggle() 切換（在隱藏與顯示之間）被選元素 $(selector).slideDown() 向下滑動（顯示）被選元素 $(selector).slideUp() 向上滑動（隱藏）被選元素 $(selector).slideToggle() 對被選元素切換向上滑動和向下滑動 $(selector).fadeIn() 淡入被選元素 $(selector).fadeOut() 淡出被選元素 $(selector).fadeTo() 把被選元素淡出為給定的不透明度 $(selector).animate() 對被選元素執(zhí)行自定義動畫

【jQuery控制元素顯示隱藏切換滑動的方法總結】相關文章：

設置雙顯示器顯示的方法11-17

顯示器的維護方法06-29

在word2010文檔中怎么查看顯示或隱藏文字04-10

內(nèi)部控制審計的程序與方法10-20

移動硬盤無法顯示解決方法12-29

酒店如何控制成本-酒店控制成本的方法03-29

品質(zhì)控制的檢驗方法07-31

有效控制服裝尺寸的方法05-25

在Word標題欄顯示文件名的方法03-10

配置顯示器顏色配置文件方法教程12-02