jQuery Effetti - Nascondere e Mostrare

jQuery fornisce un'interfaccia semplice per eseguire vari effetti sorprendenti.

I metodi di effetto di jQuery ci permettono di implementare rapidamente effetti comuni con la minima configurazione.

jQuery hide() e show()

Puoi utilizzarehide()eshow()I metodi nascondono e mostrano gli elementi HTML.

Esempio seguente dimostra l'uso dei metodi hide() e show():

// Nasconde il paragrafo normalmente visibile
$("#hide-btn").click(function(){
　　$("p").hide();
});
// Visualizza il paragrafo nascosto
$("#show-btn").click(function(){
　　$("p").show();
});

Questo èhide() Sintassi del metodo:

$(selector).hide(duration,　easing,　callback);

Questo èshow()Sintassi del metodo:

$(selector).show(duration,　easing,　callback);

hide()eshow()方法接受三个可选参数：

• duration -确定效果将持续Quanto tempo. Valori possibili: “slow”，“fast” o millisecondi

• easing -指示要用于过渡的缓动功能。可能的值：“ swing”，“ linear”

• callback-指定方法完成后要调用的函数

Esempio seguente utilizza hide() e show() per dimostraredurationParametro:

$("#hide-btn").click(function(){
　　$("p").hide(1000);
});
$("#show-btn").click(function(){
　　$("p").show(1000);
});

Esempio seguente utilizza hide() e show() per dimostrareCallbackParametro:

$("#hide-btn").click(function(){
　　$("div").hide(1000,　function(){
　　　　alert("DIV è stato nascosto");
　　});
});
$("#show-btn").click(function(){
　　$("div").show(1000,　function(){
　　　　alert("DIV è stato visualizzato");
　　});
});

Animazione di tutti i periodi (nel presente esempio sono le parole) nasconde rapidamente, completando ogni animazione in 200 millisecondi:

$("button").click(function(){
　　$("span:last-child").hide("fast",　function(){
$(this).prev().hide("fast",　arguments.callee);
　　});
});

Metodo jQuery toggle()

我们还可以使用toggle()方法在隐藏和显示HTML元素之间切换。

如果所选元素最初显示，它将被隐藏；如果隐藏，它将显示出来。

下面的示例在单击按钮时在hide和show所有<p>元素之间切换：

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

toggle()方法的语法如下：

$(selector).toggle(duration,　easing,　callback);

toggle()方法接受三个可选参数：

• duration　 -确定效果将持续多长时间。可能的值：“ slow”，“ fast”或 毫秒

• easing -指示要用于过渡的缓动功能。可能的值：“ swing”，“ linear”

• callback-指定方法完成后要调用的函数

jQuery效果参考

有关完整的效果参考，请访问我们的jQuery Effects参考手册。