Método slideUp

El método slideUp oculta suavemente elementos, enrollándolos de abajo hacia arriba. Mostrar elementos se puede hacer con el método slideDown.

Sintaxis

Ocultar durante un tiempo determinado, 400ms por defecto:

.slideUp(duración);

El tiempo se puede especificar no solo en milisegundos, sino también con palabras clave slow (600ms) y fast (200ms), cuanto mayor sea el valor, más lenta será la animación:

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

Si no se especifican parámetros - no habrá animación, los elementos se ocultarán instantáneamente:

.slideUp();

También se puede pasar una función de easing como segundo parámetro, y como tercer parámetro una función callback - se ejecutará después de completar la animación. Ambos parámetros son opcionales:

.slideUp(duración, [función de easing], [función callback]);

Se pueden pasar varias opciones al método, en forma de objeto JavaScript, que contiene pares clave: valor:

.slideUp(opciones);

Dicho objeto puede pasar los siguientes parámetros y funciones - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. La descripción de estos parámetros se puede consultar para el método animate. Por ejemplo, establezcamos la duración y la función de easing:

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

Ejemplo

Después de hacer clic en el botón, ocultemos suavemente el div padre, que contiene el input y el botón, con el método slideUp (este div lo encontraremos con el método parent). Al pasar la palabra clave slow, estableceremos la velocidad en 600ms. En el div con #test mostraremos el texto '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');
	});
});

Véase también

método slideDown,
que muestra elementos suavemente
método slideToggle,
que alterna mostrar/ocultar elementos suavemente
método fadeOut,
que oculta elementos suavemente, haciéndolos transparentes
método hide,
que oculta elementos suavemente