Metod fadeToggle

Metod fadeToggle naizmenično postepeno prikazuje ili sakriva elemente, animirajući njihovu providnost.

Sintaksa

Prikazivanje/skrivanje za zadato vreme, 400ms podrazumevano:

.fadeToggle(trajanje);

Vreme se može zadati ne samo u milisekundama, već i ključnim rečima slow (600ms) i fast (200ms), što je veća vrednost, to je sporija animacija:

.fadeToggle('slow' ili 'fast');

Ako se parametri ne navode - animacija neće biti, elementi će se prikazivati/sakrivati trenutno:

.fadeToggle();

Takođe se drugim parametrom može proslediti funkcija ubrzanja, a trećim callback funkcija - pokreće se po završetku animacije. Oba parametra su opciona:

.fadeToggle(trajanje, [funkcija ubrzanja], [callback funkcija]);

Metodu se mogu proslediti različite opcije, u vidu JavaScript objekta, koji sadrži parove ključ: vrednost:

.fadeToggle(opcije);

Takav objekat može proslediti sledeće parametre i funkcije - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Opis ovih parametara možete pogledati za metod animate. Na primer, podesimo trajanje i funkciju ubrzanja:

.fadeToggle( {duration: 800, easing: easeInSine} );

Primer

U sledećem primeru pri prvom pritisku na dugme #toggle element sa #test će se sakriti, a pri ponovnom - prikazati. Za ovo koristimo metod fadeToggle. Takođe podesićemo brzinu na 1000ms i vrednost funkcije ubrzanja na linear:

<button id="toggle">toggle</button>
<div id="test"></div>

#test {
	width: 200px;
	height: 200px;
	background: green;
	color: white;
	margin-top: 10px;
}

$('#toggle').on('click', function() {
	$('#test').fadeToggle(1000, 'linear');
});

Vidite takođe

metod slideToggle,
koji naizmenično postepeno prikazuje/skriva elemente
metod fadeTo,
koji menja providnost elemenata
metod toggle,
koji naizmenično postepeno prikazuje/skriva elemente
metod animate,
koji animira svojstva elemenata