Publicentral.com - alta en buscadores, registro buscadores, promocionaPromocion en buscadores y negocios online
Mostrando Codigo - Css
Code

Css - Redimensionar video de Youtube - Iframe altura 100%

Códigos Css

El ejemplo muestra como podemos redimensionar un video (iframe) de forma responsiva. Al redimensionar la ventana o pagina web, el vídeo modificara su tamaño de forma proporcional.
Visitas: 3,149 - 19-07-2014 14:09:15
DemoNO CONTIENE ARCHIVO DESCARGABLEComentario
CODIGO
Codigo probado en ChromeCodigo probado en Mozilla FirefoxCodigo probado en Internet Explorer 7+Codigo probado en OperaCodigo probado en Safari


/* Codigo ofrecido por Tutores.org */

  1. <style>
  2. .videoWrapper {
  3.     position: relative;
  4.     padding-bottom: 56.25%; /* 16:9 */
  5.     padding-top: 25px;
  6.     height: 0;
  7. }
  8. .videoWrapper iframe {
  9.     position: absolute;
  10.     top: 0;
  11.     left: 0;
  12.     width: 100%;
  13.     height: 100%;
  14. }
  15. </style>
  16.  
  17. <div class="videoWrapper">
  18.     <!-- Copy & Pasted from YouTube -->
  19.     <iframe width="560" height="349" src="http://www.youtube.com/embed/fAFGFs1yRkI?rel=0&hd=1" frameborder="0" allowfullscreen></iframe>
  20. </div>



ENLACE AL CODIGO
Si quieres enlazar desde tu pagina a este codigo
<!-- Inicio enlace Tutores.org -->
<a title="Tutores.org - Redimensionar video de Youtube - Iframe altura 100% " href="http://www.tutores.org/codigo/1879/" target="_blank">Redimensionar video de Youtube - Iframe altura 100% </a>
<!-- Final enlace Tutores.org -->
COMENTARIOS
Aun no existe ningun comentario para este Codigo.
INSERTAR COMENTARIO

Usuario:
Email:
Comentario:
Codigo Seguridad


Antes de enviar un comentario...
Todos los comentarios son revisados personalmente
Todo comentario que no haga relacion al codigo mostrado en esta pagina sera eliminado

Usuarios registrados tienen preferencia en recibir respuestas de ayuda!!
Ademas de poder insertar Imagenes,Enlaces y otras propiedades del editor.
Por favor, insertar los comentarios descriptivos.