Metoda slideDown

Metoda slideDown gladko prikaže skrite elemente tako, da jih odvija od zgoraj navzdol. Elemente lahko skrijete z metodo slideUp.

Sintaksa

Prikaz v določenem času, 400ms privzeto:

.slideDown(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:

.slideDown('slow' ali 'fast');

Če parametrov ne navedete - animacije ne bo, elementi bodo prikazani takoj:

.slideDown();

Kot drugi parameter lahko podate tudi funkcijo zaubljanja, in kot tretji callback funkcijo - ki se izvede po končani animaciji. Oba parametra sta neobvezna:

.slideDown(trajanje, [funkcija zaubljanja], [callback-funkcija]);

Metodi lahko podate različne možnosti, v obliki JavaScript objekta, ki vsebuje pare ključ: vrednost:

.slideDown(options);

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:

.slideDown( {duration: 600, easing: easeInSine} );

Primer

Po pritisku na gumb gladko prikažimo skriti odstavek z metodo slideDown. S podano ključno besedo slow nastavimo hitrost na 600ms. Po končani animaciji izpišemo v konzolo 'Animation complete':

<button>show text</button>
<p style="display: none">text</p>

$('button').click(function() {
	$('p').slideDown('slow', function() {
		console.log('Animation complete')
	});
});

Glejte tudi

metoda slideUp,
ki gladko skrije elemente
metoda slideToggle,
ki izmenično gladko prikaže/skrije elemente
metoda fadeIn,
ki gladko prikaže skrite elemente, jih naredi neprosojne
metoda show,
ki gladko prikaže elemente