Metoda slideToggle
Metoda slideToggle gladko prikaže
skrite elemente in skrije prikazane.
Sintaksa
Prikaz/skrivanje v določenem času,
400ms privzeto:
.slideToggle(trajanje);
Čas lahko določite ne le v milisekundah,
ampak tudi s ključnimi besedami slow (600ms)
in fast (200ms), večja kot je vrednost,
počasnejša je animacija:
.slideToggle('slow' ali 'fast');
Če parametrov ne navedete - animacije ne bo, elementi se bodo prikazali/skriti takoj:
.slideToggle();
Kot drugi parameter lahko podate tudi funkcijo zaubljanja (easing function), in kot tretji parameter callback funkcijo - ki se izvede po končani animaciji. Oba parametra sta neobvezna:
.slideToggle(trajanje, [funkcija zaubljanja], [callback-funkcija]);
Metodi lahko podate različne možnosti (opcije), v obliki JavaScript objekta, ki vsebuje pare ključ: vrednost:
.slideToggle(možnosti);
Tak objekt lahko prenaša naslednje
parametre in funkcije - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. Opis
teh parametrov si lahko ogledate za metodo
animate. Na primer,
nastavimo trajanje in funkcijo zaubljanja:
.slideToggle( {duration: 600, easing: easeInSine} );
Primer
Po pritisku na gumb gladko skrijmo
starševski div, ki vsebuje odstavke,
z metodo slideToggle (ta div
bomo našli z metodo
parent),
po ponovnem pritisku na gumb, bo div
spet gladko prikazan in tako naprej. S podajanjem ključne besede
slow, nastavimo hitrost na 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');
});
