Metoda slideDown

Metoda slideDown plynule zobrazuje skryté prvky, roztahuje je shora dolů. Skrýt prvky lze pomocí metody slideUp.

Syntaxe

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

javascript.slideDown(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:

javascript.slideDown('slow' nebo 'fast');

Pokud nezadáte parametry - animace nebude, prvky se zobrazí okamžitě:

javascript.slideDown();

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é:

javascript.slideDown(doba trvání, [funkce pro plynulost], [callback funkce]);

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

javascript.slideDown(možnosti);

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, nastavíme dobu trvání a funkci pro plynulost:

javascript.slideDown( {duration: 600, easing: easeInSine} );

Příklad

Po stisknutí tlačítka plynule zobrazme skrytý odstavec pomocí metody slideDown. Předáním klíčového slova slow nastavíme rychlost na 600ms. Po skončení animace vypíšeme do konzole 'Animation complete':

html<button>zobrazit text</button>
<p style="display: none">text</p>
javascript$('button').click(function() {
  $('p').slideDown('slow', function() {
    console.log('Animation complete')
  });
});

Viz také

  • metoda slideUp,
    která plynule skrývá prvky
  • metoda slideToggle,
    která střídá plynulé zobrazení/skrytí prvků
  • metoda fadeIn,
    která plynule zobrazuje skryté prvky, činí je neprůhlednými
  • metoda show,
    která plynule zobrazuje prvky