Auto-shrink YouTube Videos

One of the things I hate about flash-based players is that you can’t control them properly through CSS.

For example, if you write this CSS code: object {width: 100%; height: auto}

… the videos won’t scale properly (the height will stay fixed).

So I came up with this little jQuery script that makes a video fit neatly into it’s containing box:

jQuery(document).ready(function($) {
	$('object').each(function() {
		var $obj = $(this);
		var cWidth = $obj.attr('width');
		var pWidth = $obj.parent().width();

		if (cWidth <= pWidth)
		    return;

		var attr = {
			'width': pWidth,
			'height': Math.floor($obj.attr('height') * (pWidth / cWidth))
		};

		$obj.attr(attr);
		$obj.find('embed').attr(attr);
	});
});

It should work with most flash players.

comments powered by Disqus