Ver Mensaje Individual
  #6 (permalink)  
Antiguo 06/05/2009, 16:21
Avatar de alor86
alor86
 
Fecha de Ingreso: abril-2009
Mensajes: 110
Antigüedad: 15 años
Puntos: 5
Respuesta: Capa similar a ventana modal (JavaScript)

no me habia fijado que el post esta algo viejo pero si a alguien le sirve aqui esta el codigo
Código:
<html>

	<head>
		<meta http-equiv="content-type" content="text/html;" />
		<meta name="author" content="alor86" />
		<style type="text/css">
			#fondo{
				position:absolute;
				background: #000;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				opacity:0.25;
				filter:alpha(opacity="25");
			}
			#msg{
				position: absolute;
				background: #f0f0f0;
				top: 20%;
				left: 33%;
				width: 300px;
				height: 300px;
				border:groove 1px #000;
			}
			.superior{
				background: #0A3C7E;
				width: 100%;
				height: 30px;
				color: #fff;
			}
			.cerrar {
				font-weight: bolder;
				cursor: pointer;
				font-family: arial;
				margin: 2px 5px;
				float: right;
			}
			
		</style>
		<title>CreaVentana</title>
		<script type="text/javaScript">
			var fondo = false;
			var mensaje = false;
			function creaVentana(){
				fondo = document.createElement('div');
				mensaje = document.createElement('div');
				fondo.setAttribute('id','fondo');
				mensaje.setAttribute('id','msg');
				document.getElementsByTagName('body')[0].appendChild(fondo);
				document.getElementsByTagName('body')[0].appendChild(mensaje);
				mensaje.innerHTML="<div class='superior'><span class='cerrar' title='Cerrar' onclick='cerrar();'>X</span></div><p>aqui puedes meter el formulario</p>";		
			}
			function cerrar(){
				document.getElementsByTagName('body')[0].removeChild(fondo);
				document.getElementsByTagName('body')[0].removeChild(mensaje);	
				fondo=false;
				mensaje=false;
			}		
		</script>
	</head>
	
	<body>
		<input type="button" value="Crear ventana" onclick="creaVentana()"/>		
	</body>
</html>