Efecto Capa Sobrepuesta en javascript (No frameworks)

[Riki_89D]

Hola amigo como andan ?¿

Verán,estoy programando un registro para una web,el caso es que para acceder al registro debes pulsar en un hipervinculo cuyo nombre es "Registrarse",necesito crear un efecto que llevan muchas web hoy en dia y se trata de que cuando el usuario pinche en el enlace de registro,se ponga la web oscura y se vea una capa con el formulario en el centro entienden?¿ es como si la web se bloqueara y saliera una ventana al frente de todo con el registro,llevo una idea en mento (Frameworks no gracias)la idea es la siguiente:

Código (javascript) [Seleccionar] Expandir


var Ancho_Documento = window.document.body.clientWidth;
var Alto_Documento = window.document.body.clientHeight;

document.innerHTML = '<div id="Capa" style="width: '+Ancho_Documento+'; height: '+Alto_Documento+'; background-color: black;">


E echo el codigo a ojo,pero imagino que eso deberia crear una capa momentaniamente tan grande como es el documento de color negra,osea que taparia toda la web,despues le aplicaria efectos de alpha para que parezca que la web esta bloqueada para que asin salga la ventana de registro pro delante de todo (dicha ventana estaria dentor de esta capa) pero como la pongo dentro?¿ i comoago el formulario?¿ deberia programarla en HTML i no en java por que si no no veo como queda no?¿ además si aplico efectos alpha al div que bloquea el resto de la web el div que va dentro de este que bloquea (el del registro) este cojera el efecto alpha tambien no?¿ yo solo quiero sabr como ago para poner el div de registro dentro del div que bloquea la web que s este que he puesto en JS,y como evito el alpha en el DIV que esta dentro del DIV que bloquea.


saludos

[RedZer]

yo lo ago con jquery  ;Dpero puedes usar los ejemplos que estan en esta pagina igual y te sirvan
http://codecanyon.net/item/jquery-lightbox-evolution/full_screen_preview/115655

[Riki_89D]

Vaya me equivoque con el CODE,esta mal,era asin:

Código (javascript) [Seleccionar] Expandir


<script lenguage="javascript">

window.onload = function()
{

var Ancho_Documento = window.document.body.clientWidth;
var Alto_Documento = window.document.body.clientHeight;

fi = document.getElementById('divcontenidojugadores');

contenedor = document.createElement('div');
contenedor.style.width = parseInt(Ancho_Documento)+'px';
contenedor.style.height = parseInt(Alto_Documento)+'px';
contenedor.style.backgroundColor = "black";
fi.appendChild(contenedor);
}

</script>


eso para crear la capa,pero no me la crea,por que?¿ deberia crearme una capa tan grande como el cuerpo no?¿

[Riki_89D]

Cabao de probar con este:

Código (javascript) [Seleccionar] Expandir



window.onload = function()
{

contenedor = document.createElement('div');
contenedor.style.width = parseInt(document.documentElement.clientWidth)+'px';
contenedor.style.height = parseInt(document.documentElement.clientHeight)+'px';
contenedor.style.backgroundColor = "black";
document.body.appendChild(contenedor);

}


eos crea la capa en todos los BRWS,el alpha tmb lo se aplicar a todos los BRWS,pero com ago que los divs que hayan dentro no cojan el alpha?¿

[bizco]

el alpha se hereda, una solucion es que el contenido no sea hijo del que tiene transparencia, otra es usar rgba como color de fondo del div padre.

[Riki_89D]

Se me ocurrio otra idea,es que lo de hacer una capa gigante no lo veo muy limpio...se me ocurrio poner todo el cuerpo y sus elementos con alpha a 50,despues simplemente bloquear todo el cuerpo (excceptuando la capa claro) para bloquear eso utilizo:

Código (javascript) [Seleccionar] Expandir


document.body.disabled = true;


pero solo me funciona en IE,en crhome por ejemplo no lo hace,y otra cosa,si ago eso,tambien se bloqueaa la capa del regisro?¿


dew

[bizco]

no hace falta bloquear nada, es mas simple que eso.

body
    elemento
        hijo
        hijo
        hijo
    elemento -> este elemento se mostrara por encima de todos los demas, si usas alpha dara efecto que los demas estan bloqueados ya que los clicks los daras sobre esta capa siempre que ocupe el 100% tanto de alto como ancho.

[Riki_89D]

Bueno ya vis mas o menos como se hace lo de la capa superpuestra ante las demas,no es mas que una simple capa con 0.8 de color alpha y tan grande como es el cuerpo del documento punto final de la historia xd

saluds