jQuery 隱藏 顯示 淡入淡出 滑動

2021-07-23 23:30:20 字數 3424 閱讀 4493

通過 jquery,您可以使用 hide() 和 show() 方法來隱藏和顯示 html 元素:

(「#hide」).click(function());

(「#show」).click(function());

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

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

可選的 speed 引數規定隱藏/顯示的速度,可以取以下值:」slow」、」fast」 或毫秒。

可選的 callback 引數是隱藏或顯示完成後所執行的函式名稱。

jquery toggle()

通過 jquery,您可以使用 toggle() 方法來切換 hide() 和 show() 方法。

顯示被隱藏的元素,並隱藏已顯示的元素:

jquery fadein() 方法

jquery fadein() 用於淡入已隱藏的元素。

語法:

$(selector).fadein(speed,callback);

可選的 speed 引數規定效果的時長。它可以取以下值:」slow」、」fast」 或毫秒。

可選的 callback 引數是 fading 完成後所執行的函式名稱。

下面的例子演示了帶有不同引數的 fadein() 方法:

例項

$("button").click(function

());

jquery fadeout() 方法

jquery fadeout() 方法用於淡出可見元素。

語法:

$(selector).fadeout(speed,callback);

可選的 speed 引數規定效果的時長。它可以取以下值:」slow」、」fast」 或毫秒。

可選的 callback 引數是 fading 完成後所執行的函式名稱。

下面的例子演示了帶有不同引數的 fadeout() 方法:

例項

$("button").click(function

());

jquery fadetoggle() 方法

jquery fadetoggle() 方法可以在 fadein() 與 fadeout() 方法之間進行切換。

如果元素已淡出,則 fadetoggle() 會向元素新增淡入效果。

如果元素已淡入,則 fadetoggle() 會向元素新增淡出效果。

語法:

$(selector).fadetoggle(speed,callback);

可選的 speed 引數規定效果的時長。它可以取以下值:」slow」、」fast」 或毫秒。

可選的 callback 引數是 fading 完成後所執行的函式名稱。

下面的例子演示了帶有不同引數的 fadetoggle() 方法:

例項

$("button").click(function

());

jquery fadeto() 方法

jquery fadeto() 方法允許漸變為給定的不透明度(值介於 0 與 1 之間)。

語法:

$(selector).fadeto(speed,opacity,callback);

必需的 speed 引數規定效果的時長。它可以取以下值:」slow」、」fast」 或毫秒。

fadeto() 方法中必需的 opacity 引數將淡入淡出效果設定為給定的不透明度(值介於 0 與 1 之間)。

可選的 callback 引數是該函式完成後所執行的函式名稱。

下面的例子演示了帶有不同引數的 fadeto() 方法:

例項

$("button").click(function

());

jquery 滑動方法

通過 jquery,您可以在元素上建立滑動效果。

jquery 擁有以下滑動方法:

slidedown()

slideup()

slidetoggle()

jquery slidedown() 方法

jquery slidedown() 方法用於向下滑動元素。

語法: (s

elec

tor)

.sli

dedo

wn(s

peed

,cal

lbac

k);可

選的sp

eed參

數規定效

果的時長

。它可以

取以下值

:」sl

ow」、

」fas

t」或毫

秒。可選

的cal

lbac

k引數是

滑動完成

後所執行

的函式名

稱。下面

的例子演

示了sl

ided

own(

)方法:

(「#flip」).click(function());jquery slideup() 方法**

jquery slideup() 方法用於向上滑動元素。

語法:

$(selector).slideup(speed,callback);

可選的 speed 引數規定效果的時長。它可以取以下值:」slow」、」fast」 或毫秒。

可選的 callback 引數是滑動完成後所執行的函式名稱。

下面的例子演示了 slideup() 方法:

例項

$("#flip").click(function

());

jquery slidetoggle() 方法

jquery slidetoggle() 方法可以在 slidedown() 與 slideup() 方法之間進行切換。

如果元素向下滑動,則 slidetoggle() 可向上滑動它們。

如果元素向上滑動,則 slidetoggle() 可向下滑動它們。

$(selector).slidetoggle(speed,callback);

可選的 speed 引數規定效果的時長。它可以取以下值:」slow」、」fast」 或毫秒。

可選的 callback 引數是滑動完成後所執行的函式名稱。

下面的例子演示了 slidetoggle() 方法:

例項

$("#flip").click(function

());

jQuery 淡入淡出

通過 jquery,您可以實現元素的淡入淡出效果。jquery 擁有下面四種 fade 方法 fadein fadeout fadetoggle fadeto 下面一一介紹 jquery fadein 用於淡入已隱藏的元素。語法 selector fadein speed,callback 可選的 ...

jQuery 淡入淡出

通過 jquery,您可以實現元素的淡入淡出效果。jquery 擁有下面四種 fade 方法 fadein fadeout fadetoggle fadeto jquery fadein 用於淡入已隱藏的元素。語法 selector fadein speed,callback 可選的 speed 引...

jQuery 之 隱藏顯示與淡入淡出效果 三

jquery 效果 隱藏和顯示 通過 jquery,可以使用 hide 和 show 方法來隱藏和顯示 html 元素 selector hide speed,callback selector show speed,callback 可選的 speed 引數規定隱藏 顯示的速度,可以取以下值 sl...