Oscurecer pagina para enseñar formulario

[Kilin]

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.

[ArturoGallegos]

algo rápido seria como esto

Código HTML:

<span onclick="MostrarForm();">Contacto</span>
<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>
<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>
<script type="text/javascript">
    function MostrarForm(){
       var DisplayForm1 = document.getElementById('Form1');
       var DisplayForm = document.getElementById('Form');
       DisplayForm1.style.display = 'block';
       DisplayForm.style.display = 'block';
    }
</script>
<script type="text/javascript">
    function CerrarForm(){
       var DisplayForm1 = document.getElementById('Form1');
       var DisplayForm = document.getElementById('Form');
       DisplayForm1.style.display = 'none';
       DisplayForm.style.display = 'none';
    }
</script>
 

pruebalo ve si te funciona y mejoralo

[Kilin]

muchas gracias, me ha servido