Metoda slideToggle
Metoda slideToggle plynule zobrazuje
skryté prvky a skrývá zobrazené.
Syntaxe
Zobrazení/skrytí za daný čas,
400ms ve výchozím nastavení:
.slideToggle(doba trvání);
Čas lze zadat nejen v milisekundách,
ale i klíčovými slovy slow (600ms)
a fast (200ms), čím větší hodnota,
tím pomalejší animace:
.slideToggle('slow' nebo 'fast');
Pokud nezadáte parametry - animace nebude, prvky budou zobrazovány/skrývány okamžitě:
.slideToggle();
Jako druhý parametr lze také předat funkci pro plynulost, a jako třetí callback funkci - spustí se po dokončení animace. Oba parametry jsou volitelné:
.slideToggle(doba trvání, [funkce pro plynulost], [callback funkce]);
Metodu lze předat různé možnosti, ve formě JavaScript objektu, obsahujícího dvojice klíč: hodnota:
.slideToggle(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ů naleznete u metody
animate. Například,
nastavme dobu trvání a funkci pro plynulost:
.slideToggle( {duration: 600, easing: easeInSine} );
Příklad
Pojďme po stisknutí tlačítka plynule skrýt
rodičovský div, který obsahuje odstavce,
pomocí metody slideToggle (tento div
najdeme pomocí metody
parent),
po opětovném stisknutí tlačítka bude div
znovu plynule zobrazen atd. Předáním klíčového slova
slow nastavíme rychlost na 600ms:
<button>toggle text</button>
<div>
<p id='test'>text text text text text text text</p>
<p>text text text text text text text</p>
<p>text text text text text text text</p>
</div>
$('button').click(function() {
$('#test').parent().slideToggle('slow');
});
