lunes, 7 de mayo de 2012

Video autoescalable

  • Es posible lograr que un video incrustado desde Youtube se autoescale según el tamaño de la ventana usando la técnica descrita en  Responsive embeds:
    • Quitar los atributos de tamaño, width y height del tag iframe.
    • Envolver el iframe con un div .embed-container, por ejemplo.
    • Aplicar los siguientes estilos:
      .embed-container {
          position: relative;
          padding-bottom: 56.25%; /* 16/9 ratio */
          padding-top: 30px; /* IE6 workaround*/
          height: 0;
          overflow: hidden;
      }
      .embed-container iframe,
      .embed-container object,
      .embed-container embed {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
      }