Metode slideToggle
Die metode slideToggle wys verborge elemente
said en verberg gewysde elemente.
Sintaksis
Vertoon/verberging vir 'n gegewe tyd,
400ms by verstek:
.slideToggle(duur);
Tyd kan nie net in millisekondes gespesifiseer word nie,
maar ook met sleutelwoorde slow (600ms)
en fast (200ms), hoe groter die waarde,
hoe stadiger die animasie:
.slideToggle('slow' of 'fast');
As jy geen parameters spesifiseer nie - sal daar geen animasie wees nie, elemente sal onmiddellik vertoon/verberg word:
.slideToggle();
Jy kan ook 'n "easing" funksie as tweede parameter deurgee, en 'n "callback" funksie as derde - dit sal afvuur na voltooiing van die animasie. Albei parameters is opsioneel:
.slideToggle(duur, [easing funksie], [callback-funksie]);
Jy kan verskeie opsies aan die metode deurgee, in die vorm van 'n JavaScript objek, wat sleutel: waarde pare bevat:
.slideToggle(opsies);
So 'n objek kan die volgende
parameters en funksies oordra - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. Beskrywing
van hierdie parameters kan jy vind by die
animate metode. Byvoorbeeld,
kom ons stel duur en easing funksie:
.slideToggle( {duration: 600, easing: easeInSine} );
Voorbeeld
Kom ons verberg, na 'n knopdruk, die
ouer div wat paragrawe bevat,
said met die slideToggle metode (hierdie div
sal ons vind met die
parent metode).
Na 'n tweede knopdruk, sal die div
weer sagte vertoon word, ens. Deur die sleutelwoord
slow deur te gee, stel ons die spoed op 600ms:
<button>toggle text</button>
<div>
<p id='test'>text text text text text text text</p>
<p>text text text text text text text</p>
<p>text text text text text text text</p>
</div>
$('button').click(function() {
$('#test').parent().slideToggle('slow');
});
