Metoda toggle

Metoda toggle střídá plynulé zobrazení/skrytí prvků. Pokud je prvek zobrazen, bude skryt a naopak.

Syntaxe

Zobrazení po zadanou dobu v milisekundách, 400ms ve výchozím nastavení:

.toggle(doba trvání);

Čas lze zadat nejen v milisekundách, ale i klíčovými slovy slow (600ms) a fast (200ms), čím vyšší hodnota, tím pomalejší animace:

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

Parametrem display lze předat hodnotu true nebo false. Pokud true, prvek bude pouze zobrazen, false - skryt:

.toggle(display);

Pokud nejsou parametry uvedeny - animace nebude, prvky se budou zobrazovat/skrývat okamžitě:

.toggle();

Jako druhý parametr lze také předat funkci plynulosti a jako třetí callback funkci - spustí se po dokončení animace. Oba parametry jsou volitelné:

.toggle(doba trvání, [funkce plynulosti], [callback funkce]);

Jako druhý volitelný parametr lze jednoduše předat callback funkci - spustí se po dokončení animace:

.toggle(doba trvání, [callback funkce]);

Metodu lze předat různé možnosti, ve formě JavaScript objektu obsahujícího dvojice klíč: hodnota:

.toggle(options);

Takový objekt může předávat následující parametry a funkce - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Popis těchto parametrů můžete zobrazit pro metodu animate. Například, nastavme dobu trvání a funkci plynulosti:

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

Příklad

Po stisknutí tlačítka plynule zobrazme skrytý odstavec pomocí metody toggle. Předáním klíčového slova slow nastavíme rychlost na 600ms. Při opětovném stisknutí - skrýt:

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

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

Viz také

metoda fadeToggle,
která mění průhlednost prvků
metoda slideToggle,
která střídá plynulé zobrazení/skrytí prvků
metoda show,
která plynule zobrazuje prvky
metoda hide,
která plynule skrývá prvky