When you set an iFrame to max-width 100%, it can't adjust it's own height. That is because iFrames are stupid, this plugin is like a 4 year education to an iFrame, which the iFrame will squander anyway.

jQuery flexiFrame plugin

(function($) {

  var methods = {
		adjustHeight : function(ratio, width) {
			if(width == currentWidth) return;
			currentWidth = width;
			this.height(width/ratio);
		}
	},
	currentWidth;

	// allow iFrames to have a 'max-width'
	$.fn.flexiFrame = function() {
		// first set a max-width of 100% if it doesn't already have that
		this.css('max-width', '');
		var self = this,
				width = this.width(),
				ratio = width / this.height();
				currentWidth = width;

		setTimeout(function() {
			self.css('max-width', '100%');
			window.setInterval(function() {
				methods.adjustHeight.apply(self, [ratio, self.width()]);
			}, 100);
		}, 10);
	};

})( jQuery );