
This is the piece of jQuery code that I now include in the footer of all of my themes:
$("object, embed, .format-video iframe").each(function() {
var orig = $(this);
var ratio = orig.attr("height") / orig.attr("width");
var parWidth = orig.parents().find("p:last").width();
if(orig.attr("width")> parWidth) {
orig
.attr("width", parWidth)
.attr("height", (parWidth * ratio));
}
});
This code finds every video and checks to see what the parent containers width is. It then resizes the video to the correct size and aspect ratio so that it doesn’t exceed the boundaries of the parent container. You can see it working on the front page of the Magazine Premium demo.


