En este tutorial explicaré como hacer aparecer secciones de un formulario o cualquier otro elemento de nuestro sitio usando jquery, yo lo suelo usar cuando tengo un formulario de búsqueda y deseo mostrar opciones de búsqueda avanzada por ejemplo o también es posible usarlo a modo de acordeón
Ocultar un elemento
Si bien es cierto que podemos ocultar un elemento cualquiera lo mejor es colocar un div que agrupe el elemento o elementos que deseamos ocultar si es un formulario y estas basado en una estructura de OL/UL y LI le asignamos u ID a es LI que deseamos ocultar, nuestro código sería algo así:
[cc lang=»HTML»]
Aqui el texto o elementos del formulario que se ocultarán
Para ocultar podemos usar link o un boton
Click para ocultarlo
[/cc]
Nuestro código jquery para detectar que se ha hecho click sería:
[cc lang=»javascript»]
$(document).ready(function(){
estado=0;
$(«#oculta»).click(function () {
if(estado==0) {
$(‘#paraocultar’).slideUp(‘fast’);
estado=1;
} else {
$(‘#paraocultar’).slideDown(‘fast’);
estado=0;
}
});
});
[/cc]
//////// Actualización ///////
He modificado el script para funcionar con múltiples elementos, pueden ver el ejemplo aqui
[download id=»3″ format=»1″]
Demo
