Metod slideUp

Metod slideUp postepeno sakriva elemente, smotavajući ih odozdo prema gore. Prikazati elemente možemo pomoću metoda slideDown.

Sintaksa

Sakrivanje u zadatom vremenskom periodu, 400ms podrazumevano:

javascript.slideUp(trajanje);

Vreme možemo 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:

javascript.slideUp('slow' ili 'fast');

Ako ne navedemo parametre - animacija neće postojati, elementi će se sakriti momentalno:

javascript.slideUp();

Takođe možemo kao drugi parametar proslediti funkciju ublažavanja (easing), a kao treći callback funkciju - izvršiće se nakon završetka animacije. Oba parametra su opcionalna:

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

Možemo proslediti metodu različite opcije, u obliku JavaScript objekta, koji sadrži parove ključ: vrednost:

javascript.slideUp(opcije);

Ovakav 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, podesićemo trajanje i funkciju ublažavanja:

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

Primer

Hajde da nakon klika na dugme, postepeno sakrijemo roditeljski div, koji sadrži input i dugme, pomoću metoda slideUp (ovaj div naći ćemo pomoću metoda parent). Prosleđivanjem ključne reči slow, podešćemo brzinu na 600ms. U div sa #test ispisaćemo natpis 'Text is hidden':

html<div>
  <button>sakrij tekst</button>
  <input type="text" value="aaa">
</div>
<div id="test"></div>

javascript$('button').click(function() {
  $(this).parent().slideUp('slow', function() {
    $('#test').text('Text is hidden');
  });
});

Pogledajte takođe