Metodo slideUp

Il metodo slideUp nasconde fluidamente gli elementi, arrotolandoli dal basso verso l'alto. Mostrare gli elementi è possibile con il metodo slideDown.

Sintassi

Nascondere in un tempo dato, 400ms di default:

.slideUp(durata);

Il tempo può essere impostato non solo in millisecondi, ma anche con le parole chiave slow (600ms) e fast (200ms), più alto è il valore, più lenta è l'animazione:

.slideUp('slow' o 'fast');

Se non si specificano parametri - non ci sarà animazione, gli elementi verranno nascosti istantaneamente:

.slideUp();

È anche possibile passare come secondo parametro una funzione di easing, e come terzo una funzione di callback - si attiverà dopo il completamento dell'animazione. Entrambi i parametri sono opzionali:

.slideUp(durata, [funzione di easing], [funzione di callback]);

Si possono passare al metodo varie opzioni, sotto forma di oggetto JavaScript, contenente coppie chiave: valore:

.slideUp(opzioni);

Un tale oggetto può trasmettere i seguenti parametri e funzioni - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. La descrizione di questi parametri la puoi vedere per il metodo animate. Ad esempio, impostiamo la durata e la funzione di easing:

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

Esempio

Dopo aver cliccato il pulsante, nascondiamo fluidamente il div genitore, che contiene l'input e il pulsante, con il metodo slideUp (questo div lo troveremo con il metodo parent). Passando la parola chiave slow, imposteremo la velocità a 600ms. Nel div con #test visualizzeremo la scritta 'Text is hidden':

<div>
	<button>hide text</button>
	<input type="text" value="aaa">
</div>
<div id="test"></div>

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

Vedi anche

metodo slideDown,
che mostra fluidamente gli elementi
metodo slideToggle,
che alterna la visualizzazione/nascondimento fluido degli elementi
metodo fadeOut,
che nasconde fluidamente gli elementi, rendendoli trasparenti
metodo hide,
che nasconde fluidamente gli elementi