Metode slideToggle
Metode slideToggle vienmērīgi rāda
paslēptus elementus un paslēpj parādītos.
Sintakse
Rādīšana/paslēpšana noteiktā laikā,
400ms pēc noklusējuma:
.slideToggle(duration);
Laiku var norādīt ne tikai milisekundēs,
bet arī ar atslēgvārdiem slow (600ms)
un fast (200ms), jo lielāka vērtība,
jo lēnāka animācija:
.slideToggle('slow' vai 'fast');
Ja neizmantot parametrus - animācijas nebūs, elementi tiks rādīti/paslēpti acumirklī:
.slideToggle();
Var arī kā otro parametru padot gludināšanas funkciju, un kā trešo - callback funkciju - tā darbosies pēc animācijas pabeigšanas. Abi parametri nav obligāti:
.slideToggle(duration, [gludināšanas funkcija], [callback funkcija]);
Metodei var padot dažādas opcijas, JavaScript objekta veidā, kas satur pārus atslēga: vērtība:
.slideToggle(options);
Šāds objekts var nodot sekojošus
parametrus un funkcijas - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. Šo
parametru aprakstu varat apskatīt metodei
animate. Piemēram,
iestatīsim ilgumu un gludināšanas funkciju:
.slideToggle( {duration: 600, easing: easeInSine} );
Piemērs
Pēc pogas nospiešanas, vienmērīgi paslēpsim
vecākā div, kas satur rindkopas,
ar metodes slideToggle palīdzību (šo div
mēs atradīsim ar metodes
parent palīdzību),
pēc otrreizējas pogas nospiešanas, div tiks
atkal vienmērīgi parādīts un tā tālāk. Padodot atslēgvārdu
slow, mēs iestatīsim ātrumu uz 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');
});