Formularios Desplegables como pestañas

[enridp]

Hola !
Estoy tratando de hacer un formulario de búsqueda avanzada. El problema no es el armado del mismo sino la visualización. Me gustaría que esté oculto, que sólo se vea un botón "Buscar" y al presionarlo se despliegue el formulario completo para hacer la búsqueda.
Sería algo como esto:
cssplay.co.uk/menus/hidden.html
pero con un formulario dentro en lugar de un menú.
Creo que se puede desarmar un poco el ejemplo anterior y hacer algo, pero si alguien tiene una sugerencia más simple rápida o efectiva, pues bienvenida sea.

Saludos !
enri.

[JavierB]

Mensaje movido al foro de JavaScript desde Css.

Saludos,

[locojars]

Veamos si esto te ayuda:

Código HTML:

<script language="JavaScript">
	function mostrar_form()
	{
	    document.f1.reset();
  		document.getElementById("form_contacto").style.visibility='visible';
		document.getElementById("form_contacto").style.position='absolute';
		document.getElementById("form_contacto").style.left='125px';
		document.getElementById("form_contacto").style.top='125px';
	}

	function procesar_form()
	{
	  document.f1.action="formularios.php?opcion=insertar";
	  document.f1.submit();
          document.getElementById("form_contacto").style.visibility='hidden';
	}
</script> 

Y en tu body tienes esto:

Código:

<a href="#" onclick="javascript:mostrar_form();">[Buscar]</a>
<div id="form_contacto" style="background-color:#E3F5DC; width:375px; border-top:1px solid #000000;border-left:1px solid #000000;border-right:1px solid #000000;border-bottom:1px solid #000000;visibility:hidden">
<table border="0" align="center" width="100%">
  <form method="post" name="f1" action="">
.... tu formulario.
<input type="button" value="Buscar" onClick="procesar_form();">
</form>
</div>

Mira a ver si esto te funciona, la idea es que te muestre el div al presionar el link de buscar y que al procesar el formulario lo esconda. Mira a ver si esto te ayuda.
Salud2,

[enridp]

Hola !
Pido perdón si coloqué mal el post, creí que se podía hacer bien con CSS...
Gracias locojars por tu ejemplo !
Creo que puede servirá pero no estoy del todo seguro.
La idea es aplicarlo a esta página:
usuarios.arnet.com.ar/enridp/OV/indexAux.htm
(o a esta que mejoró un compañero de este foro: usuarios.arnet.com.ar/enridp/OV/indexDelForo.htm)
Quería poner una imagen que diga Buscar arriba de todo que al clickear (o pasar por encima, no se todavia...) despliegue el formulario de búsqueda.
Pero que el formulario no desplace nada, se superponga limpiamente sobre el contenido de la página.
Tal vez el truco sea simplemente aplicarlo sobre un DIV medio flotante.
Pero ya me estuvieron dando muchos problemas esas cositas para alinearlas bien asique por las dudas pregunto si hay una buena estrategia para armar lo que digo.

Saludos !
enrique.

[enridp]

Hola de nuevo yo...
Agrego los ejemplos que armé, bien simples para ver si andaba nada más.

usuarios.arnet.com.ar/enridp/OV/indexAuxDesplegable.htm
usuarios.arnet.com.ar/enridp/OV/indexDelForoDesplegable.htm

Puse 3 Scripts de 3 usuarios, uno tuyo locojars (que parece ser el único que anda, no se por qué los otros no anduvieron en mi ejemplo... en paginas nuevas si funcionan).
De todas formas el efecto no es del todo el deseado, en la segunda página por ejemplo el formulario se pone atrás de todo... y en ambas páginas me desacomodaron el menú que renegué una vida para ponerlo bien... tal vez se puedan solucionar ambos problemas toqueteando bien el zindex y las posiciones de los estilos pero ya me veo sufriendo de nuevo con eso
Espero a alguien se le ocurra algo...


Saludos !
enrique.
PD1: Al principio había puesto esto en CSS porque me imaginé que se podía hacer algo como esto:
Diseñar el formulario, colocarlo en donde se quiere, luego con CSS meterle una posicion en Y negativa asi desaparece... Cuando se clickea sobre algo que el CSS cambien la posicion de Y para que se vea el formulario (como que lo baja y lo sube...) También calculo que se podría hacer con visibility como se está haciendo con los scripts... pero en definitiva igual con javascript debería poderse bien no?
PD2:ya que está dejo un buen link con diseños interesantes de formularios para el que no lo conocía:
smashingmagazine.com/2006/11/11/css-based-forms-modern-solutions/