jQuery-effekte - Versteek en wys


Versteek, wys, wissel, gly, vervaag en animeer. SJOE!

Klik om paneel te wys/versteek

Omdat tyd waardevol is, lewer ons vinnige en maklike leer.

By W3Schools kan jy alles bestudeer wat jy nodig het om te leer, in 'n toeganklike en handige formaat.


Voorbeelde


Demonstreer 'n eenvoudige jQuery hide() metode.


Nog 'n versteek() demonstrasie. Hoe om dele van teks te versteek.


jQuery verberg() en wys()

Met jQuery kan jy HTML-elemente versteek en wys met die hide()en show()metodes:

Voorbeeld

$("#hide").click(function(){
  $("p").hide();
});

$("#show").click(function(){
  $("p").show();
});

Sintaksis:

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

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

Die opsionele spoedparameter spesifiseer die spoed van die wegsteek/vertoon, en kan die volgende waardes neem: "stadig", "vinnig" of millisekondes.

Die opsionele terugbelparameter is 'n funksie wat uitgevoer moet word nadat die hide()of show()metode voltooi is (jy sal meer oor terugbelfunksies in 'n latere hoofstuk leer).

Die volgende voorbeeld demonstreer die spoedparameter met hide():

Voorbeeld

$("button").click(function(){
  $("p").hide(1000);
});


jQuery wissel ()

Jy kan ook wissel tussen versteek en wys 'n element met die toggle()metode.

Getoonde elemente is versteek en versteekte elemente word gewys:

Voorbeeld

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

Sintaksis:

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

Die opsionele spoedparameter kan die volgende waardes neem: "stadig", "vinnig" of millisekondes.

Die opsionele terugbelparameter is 'n funksie wat uitgevoer moet word nadat toggle()dit voltooi is.


jQuery Oefeninge

Toets jouself met oefeninge

Oefening:

Gebruik 'n jQuery-metode om 'n <p>-element te versteek wanneer daarop geklik word.

$("p").click(function(){
  $(this).();
});


jQuery Effekte Verwysing

Vir 'n volledige oorsig van alle jQuery-effekte, gaan asseblief na ons jQuery-effekverwysing .