Skip to content

@tammyhart /responsive-iframes.js
Last active

Embed URL

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Make iframes responsive by calculating the correct aspect ratio and filling to the width of the container as it flexes.
// iframes
var $iframes = $( document.querySelectorAll( '.videos iframe' ) );
function iframeSizing() {
var $this = $( this ),
width = $this.width(),
height = $this.height(),
containerWidth = $this.parent().width(),
heightRatio = height / width,
newHeight = heightRatio * containerWidth;
$this.width( containerWidth );
$this.height( newHeight );
}
function iframesEachSizing() {
$iframes.each( iframeSizing );
}
iframesEachSizing();
$( window ).resize( iframesEachSizing );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.