Metod toggle

Metod toggle naizmenično postepeno prikazuje/skriva elemente. Ako je element prikazan, on će biti skriven i obrnuto.

Sintaksa

Prikaz tokom određenog vremena u milisekundama, 400ms podrazumevano:

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

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

Parametrom display može se proslediti vrednost true ili false. Ako je true, element će se samo prikazivati, false - skrivati:

.toggle(display);

Ako se ne navede parametar - animacija neće postojati, elementi će se prikazivati/skrivati momentalno:

.toggle();

Takođe se drugim parametrom može proslediti funkcija ublažavanja (easing), i trećim callback funkcija - pokreće se nakon završetka animacije. Oba parametra su opciona:

.toggle(trajanje, [funkcija ublažavanja], [callback funkcija]);

Može se jednostavno drugim opcionim parametrom proslediti callback funkcija - pokreće se nakon završetka animacije:

.toggle(trajanje, [callback funkcija]);

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

.toggle(options);

Takav objekat može da sadrži 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 ublažavanja:

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

Primer

Hajde da nakon klika na dugme, postepeno prikažemo skriveni pasus pomoću metoda toggle. Prosleđivanjem ključne reči slow, podesićemo brzinu na 600ms. Ponovnim klikom - skrivaće se:

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

$('button').click(function() {
	$('p').toggle('slow');
});

Pogledajte takođe

metod fadeToggle,
koji menja providnost elemenata
metod slideToggle,
koji naizmenično postepeno prikazuje/skriva elemente
metod show,
koji postepeno prikazuje elemente
metod hide,
koji postepeno skriva elemente