Saludos, la cuestion es que quiero colocar un video de fondo en un div al 100% y sobre este colocar dos div semi transparentes con un width de 50% cada uno...El asunto es que al colocar el video dentro del primer div ( al 100%) los otros dos no se muestran..he probado con z-index y nada..colocando una imagen dentro del div al 100% si se ve todo bien, pero al colocar el video, todo se mueve...a continuación el codigo:
HTML:
Código:
<div id="video">
<video autoplay="" loop="loop" preload="true" width="100%">
<source src="../carpeta/rootl/video/chrome_japan.ogv" type="video/ogg"></video>
<div id="contenidoder">Este div es transparente </div>
<div id="contenidoizq">Este otro div es transparente</div>
</div>
CSS:
Código:
#video {
width:100%;
height:500px;
position:absolute;
z-index:999;
overflow:hidden;
#contenidoizq { width:50%;
height:500px;
background-color:#32c0c4;
float: right;
position:absolute;
z-index:2;
/*border:#333 solid 1px;*/ }
#contenidoder { width:50%;
height:500px;
float:right;
background-color:#32689b;
position:absolute;
z-index:1;
border:#333 solid 1px;
}
NOta: Para colocar los div transparentes uso un Js llamado Transify...
Gracias por cualquier ayuda prestada