Metoda slideUp

Metoda slideUp ascunde lin elementele, derulându-le de jos în sus. Afișarea elementelor se poate face cu ajutorul metodei slideDown.

Sintaxă

Ascunderea în timpul stabilit, 400ms implicit:

javascript.slideUp(durată);

Timpul poate fi stabilit nu doar în milisecunde, ci și prin cuvinte cheie slow (600ms) și fast (200ms), cu cât valoarea este mai mare, cu atât animația este mai lentă:

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

Dacă nu se specifică parametri - animație nu va fi, elementele se vor ascunde instantaneu:

javascript.slideUp();

De asemenea, se poate transmite ca al doilea parametru o funcție de easing, și ca al treilea parametru o funcție callback - se va executa după finalizarea animației. Ambele parametri sunt opționale:

javascript.slideUp(durată, [funcție de easing], [funcție callback]);

Metodei i se pot transmite diverse opțiuni, sub forma unui obiect JavaScript, care conține perechi cheie: valoare:

javascript.slideUp(opțiuni);

Un astfel de obiect poate transmite următorii parametri și funcții - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Descrierea acestor parametri o puteți vedea pentru metoda animate. De exemplu, să stabilim durata și funcția de easing:

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

Exemplu

Hai să după apăsării butonului, să ascundem lin div-ul părinte, care conține inputul și butonul, cu ajutorul metodei slideUp (acest div îl vom găsi cu ajutorul metodei parent). Transmițând cuvântul cheie slow, vom stabili viteza la 600ms. În div-ul cu #test vom afișa inscripția 'Text is hidden':

html<div>
  <button>hide text</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');
  });
});

Vedeți și