Hola a todos,
Quería poner una ventana emergente en mi web pero cuando pongo este código me sale entremezclado con la Página principal.
<div id='ventana-flotante'>
<a class='cerrar' href='javascript
:void(0);' onclick='document.getElementById('ventana-flotante').className = 'oculto''>x</a>
<div id='contenedor'>
<div class='contenido'>
<font size="2">
<font color="BLUE">
<font face="ARIAL BLACK">
<DIV ALIGN=CENTER>
<P>TVNUNDIAL AGRADECE TU VISITA
<font size="1">
<P>PRESIONA LA X PARA CERRAR
<P> ESTA VENTANA
</font>
</div>
<div id="nota-texto" class="span6 pull-right last nota-texto">
<DIV ALIGN=CENTER>
<p><img src="http://www.4shared.com/download/Ecn-9Q9Lce/finalArg.jpg?lgfp=3000" width="457"></p>
</DIV>
</div>
<style>
#ventana-flotante {
width: 580px; /* Ancho de la ventana */
height: 480px; /* Alto de la ventana */
background: #005656; /* Color de fondo */
position: top;
top: 100px;
left: 50%;
margin-left: 0px;
border: 1px solid #adffad; /* Borde de la ventana */
box-shadow: 0 5px 25px rgba(0,0,0,.1); /* Sombra */
z-index:999;
}
#ventana-flotante #contenedor {
padding: 25px 10px 10px 20px;
}
#ventana-flotante .cerrar {
float: right;
border-bottom: 1px solid #bbb;
border-left: 1px solid #bbb;
color: #005656;
background: red;
line-height: 37px;
text-decoration: none;
padding: 0px 14px;
font-family: Arial black;
border-radius: 0 0 0 5px;
box-shadow: -1px 1px white;
font-size: 22px;
-webkit-transition: .3s;
-moz-transition: .3s;
-o-transition: .3s;
-ms-transition: .3s;
}
#ventana-flotante .cerrar:hover {
background: #005656;
color: white;
text-decoration: none;
text-shadow: -1px -1px red;
border-bottom: 1px solid red;
border-left: 1px solid red;
}
#CERRAR VENTANA AUTOMATICAMENTE
setTimeout('closeWin(newWindow)', 5000); // tiempo 5 segundos antes de cerrar
}
function closeWin(newWindow) {
newWindow.close(); // cerrar la ventana
}
#ventana-flotante #contenedor .contenido {
padding: 25px;
box-shadow: inset 1px 1px white;
background: #deffc4; /* Fondo del mensaje */
border: 1px solid #9eff9e; /* Borde del mensaje */
font-size: 11px; /* Tamaño del texto del mensaje */
color: #555; /* Color del texto del mensaje */
text-shadow: 1px 1px white;
margin: 0 auto;
border-radius: 4px;
}
.oculto {-webkit-transition:1s;-moz-transition:1s;-o-transition:1s;-ms-transition:1s;opacity:0;-ms-opacity:0;-moz-opacity:0;visibility:hidden;}
</style>
<!--[if IE]>
<style>
.oculto {display:none}
</style>
<![endif]-->
La idea es que salga una ventana flotante encima de la web que se pueda cerrar.
¿que hago mal?
Saludos y gracias de antemano.