Ti sarai chiesto come è possibile riuscire a rendere responsive un video in formato 16:9 e permetterne la visibilità ottimale sia sul web che naturalmente sul mobile, rispettandone le proporzioni. Non è difficile se segui lo script qui sotto.
Di fatto è necessario includere l’iframe in un DIV che aggiunge uno stile che definisce che il contenuto all’interno debba avere un’altezza che si autoproporziona al formato richiesto (in questo caso 16:9) ed il gioco è fatto.
<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;">
<iframe style="width:100%; height:100%; position:absolute;
left:0px; top:0px; overflow:hidden"
frameborder="0" type="text/html"
src="https://www.youtube.com/embed/PRfIUPQju4w"
width="100%" height="100%" allowfullscreen allow="autoplay">
</iframe>
</div>
Ciao