Metoda toggle

Metoda toggle izmenično gladko prikazuje/skriva elemente. Če je element prikazan, bo skrit in obratno.

Sintaksa

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

.toggle(trajanje);

Čas je mogoče nastaviti 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:

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

Kot parameter display je mogoče posredovati vrednost true ali false. Če je true, se bo element samo prikazal, false - skril:

.toggle(display);

Če parametrov ne navedete - animacije ne bo, elementi se bodo prikazali/skrili takoj:

.toggle();

Kot drugi parameter je mogoče posredovati tudi funkcijo zglajevanja, in kot tretji parameter callback funkcijo - ki se sproži po izvedbi animacije. Oba parametra sta neobvezna:

.toggle(trajanje, [funkcija zglajevanja], [callback-funkcija]);

Kot drugi neobvezni parameter je mogoče preprosto posredovati callback-funkcijo - sproži se po izvedbi animacije:

.toggle(trajanje, [callback-funkcija]);

Metodu je mogoče posredovati različne možnosti, v obliki JavaScript objekta, ki vsebuje pare ključ: vrednost:

.toggle(options);

Takšen objekt lahko posreduje 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 zglajevanja:

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

Primer

Po pritisku na gumb gladko prikažimo skriti odstavek z metodo toggle. S posredovanjem ključne besede slow, nastavimo hitrost na 600ms. Ob ponovnem pritisku - skrijemo:

<button>prikaži besedilo</button>
<p style="display: none">besedilo</p>

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

Glejte tudi

metoda fadeToggle,
ki spreminja prosojnost elementov
metoda slideToggle,
ki izmenično gladko prikazuje/skriva elemente
metoda show,
ki gladko prikazuje elemente
metoda hide,
ki gladko skriva elemente