Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Galera, há alguma forma de colocar uma moldura "div, imagem" em cima de um video youtube, onde o video fica atrás, mas que não tem seus botões desativados? tipo como se o vídeo estivesse apenas transparente por cima da moldura?
<body>
<header id="main">
<div id="iframe_video" >
<!--<iframe width="320" height="247" src="http://www.youtube.com/embed/LK-x3AFSfiM&autoplay=1" frameborder="0" wmode="transparent" allowfullscreen></iframe> -->
<!--<object width="320" height="247">
<param name="movie" value="http://www.youtube.com/v/LK-x3AFSfiM&autoplay=1?version=3&hl=pt_BR"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/LK-x3AFSfiM&autoplay=1?version=3&hl=pt_BR" type="application/x-shockwave-flash" wmode="transparent" width="320" height="247" allowscriptaccess="always" allowfullscreen="true"></embed>
</object>-->
<iframe id="ytplayer" width="640" height="360" src="https://www.youtube.com/embed/LK-x3AFSfiM?&autoplay=1&rel=0" allowscriptaccess="always" </iframe>
</div>
<article id="paradise">
<!--<a id="owl" href="inicio.html">
<img id="rays" src="images/Coruja/rays.png" alt="Rays">
<img id="bod" src="images/Coruja/owl.png" alt="Owl">
<img id="rt" class="wing" src="images/Coruja/rt-wing.png" alt="Right Wing">
<img id="lt" class="wing" src="images/Coruja/lt-wing.png" alt="Left Wing">
<img id="eyes" src="images/Coruja/eyes.gif" alt="Eyes">
</a>-->
<ul id="social-bar">
<li><a href="http://www.facebook.com" title="Become a fan" class="poshytip"><img src="images/Galeria/social/facebook.png" alt="Facebook" /></a></li>
<li><a href="http://www.twitter.com" title="Follow my tweets" class="poshytip"><img src="images/Galeria/social/twitter.png" alt="twitter" /></a></li>
<li><a href="http://www.google.com" title="Add to the circle" class="poshytip"><img src="images/Galeria/social/plus.png" alt="Google plus" /></a></li>
</ul>
</article>
</header>
</body>
HTML
* {padding:0; margin:0px auto;
}body {
background:
url(images/1280/Backs/back5.png) repeat;
height:100%;
width:100%;
}
#paradise {
background:url(images/paradise/paradise.png) no-repeat;
margin:0px auto;
width:841px;
height:584px;
position:relative;
}
#iframe_video{
height:330px;
width:640px;
margin:0px auto;
}
#ytplayer{
height:332px;
width:608px;
}
#main {
width:1080px;
margin:0px auto;
position:relative;
}
#social-bar{
display: block;
overflow: hidden;
margin-bottom:10px;
}#social-bar li{
display: block;
float: left;
width: 36px;
height: 36px;
margin-left: 5px;
}#social-bar li a{
display: block;
width: 100%;
height: 100%;
}
#canvas {
height:100%;
width:100%;
top:0px;
left:0px;
}
#loader {
background: url(images/1280/Backs/back5.png) repeat;
}
CSS PRINCIPAL...
VLW GALERA.
Carregando comentários...