Foros del Web » Creando para Internet » HTML »

Oscurecer pagina para enseñar formulario

Estas en el tema de Oscurecer pagina para enseñar formulario en el foro de HTML en Foros del Web. Pues verán, quiero que al clickear un boton en mi web, la página se oscurezca y aparezca en el centro un formulario, sobre el resto ...
  #1 (permalink)  
Antiguo 28/07/2011, 14:04
 
Fecha de Ingreso: junio-2011
Mensajes: 92
Antigüedad: 12 años, 9 meses
Puntos: 3
Oscurecer pagina para enseñar formulario

Pues verán, quiero que al clickear un boton en mi web, la página se oscurezca y aparezca en el centro un formulario, sobre el resto de la página.


Se que con JS se puede, pero ademas de no tener el codigo a mano, quiero algo más simple que un minucuadrado que se agranda para aparecer el formulario, quiero solo que se oscurezca y aparezca de golpe.
  #2 (permalink)  
Antiguo 28/07/2011, 14:26
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 6.774
Antigüedad: 16 años
Puntos: 1146
Respuesta: Oscurecer pagina para enseñar formulario

algo rápido seria como esto

Código HTML:
Ver original
  1. <span onclick="MostrarForm();">Contacto</span>
  2. <div id="Form1" style="display:none;width:100%;height:100%;background:#000;position:absolute;top:0;left:0;z-index:10;opacity:0.4;filter:alpha(opacity=40);">&nbsp;</div>
  3. <form id="Form" style="display:none;width:200px;height:200px;background:#fff;border:#f00;position:absolute;top:50%;left:50%;z-index:20;margin:-110px 0 0 -110px;padding:10px;">campo1<input /><br />campo2<input /><span onclick="CerrarForm();">Cerrar</span></form>
  4. <script type="text/javascript">
  5.     function MostrarForm(){
  6.        var DisplayForm1 = document.getElementById('Form1');
  7.        var DisplayForm = document.getElementById('Form');
  8.        DisplayForm1.style.display = 'block';
  9.        DisplayForm.style.display = 'block';
  10.     }
  11. <script type="text/javascript">
  12.     function CerrarForm(){
  13.        var DisplayForm1 = document.getElementById('Form1');
  14.        var DisplayForm = document.getElementById('Form');
  15.        DisplayForm1.style.display = 'none';
  16.        DisplayForm.style.display = 'none';
  17.     }

pruebalo ve si te funciona y mejoralo
  #3 (permalink)  
Antiguo 28/07/2011, 16:23
 
Fecha de Ingreso: junio-2011
Mensajes: 92
Antigüedad: 12 años, 9 meses
Puntos: 3
Respuesta: Oscurecer pagina para enseñar formulario

muchas gracias, me ha servido

Etiquetas: oscurecer, formulario, botones
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 00:24.