Método hide
El método hide oculta elementos suavemente. Mostrar
elementos se puede hacer con el método
show.
Sintaxis
Desaparición en un tiempo determinado,
400ms por defecto:
.hide(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:
.hide('slow' o 'fast');
Si no se especifican parámetros - no habrá animación, los elementos se ocultarán instantáneamente:
.hide();
También se puede pasar una función de easing como segundo parámetro, y una función callback como tercero - se ejecutará después de completar la animación. Ambos parámetros son opcionales:
.hide(duración, [función de easing], [función callback]);
Se pueden pasar varias opciones al método, en forma de objeto JavaScript, que contenga pares clave: valor:
.hide(opciones);
Dicho objeto puede contener los siguientes
parámetros y funciones - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. La descripción
de estos parámetros la puedes ver para el método
animate. Por ejemplo,
establezcamos la duración y la función de easing:
.hide( {duration: 800, easing: easeInSine} );
Ejemplo
Después de pulsar el botón #test, desvanezcamos
suavemente el párrafo con el método hide. Pasando
la palabra clave slow, estableceremos la velocidad
a 600ms. Después de que termine la animación mostraremos en
la consola 'Animation complete':
<button id="test">hide text</button>
<p>text</p>
$('#test').click(function() {
$('p').hide('slow', function() {
console.log('Animation complete')
});
});