jQueryを使って指定サイズに画像均等縮小みたいな〜

テーブルの中に画像を表示させる際、幅か高さをぴったりあわせて均等縮小でおさめたいときに。
（追記：記事と別コード追加 2011-12-15）
サンプルはこちら→W7工廠分室|トップページ
サイズを変更できるようにしました。（変更の必要がない場合はinputとか不要です）


HTML(head)

<script src="jquery.js"></script>
<script type="text/javascript" src="jq_imgSizeControl.js"></script>
<script>
$(function(){
	$('input#tbutton').click(function(){
		imgSizeControl($('input#twidth').val(),$('input#theight').val());
	});
});
</script>

HTML(body)

<input id="twidth" type="text"/>
<input id="theight" type="text"/>
<input id="tbutton" type="button" value="サイズ変更"/>
<table class="imgSizeControl">

JavaScript (jq_imgSizeControl.js)

/* jq_imgSizeControl2.js 2010-09-26→2011-12-15 */
function imgSizeControl(tdWidth,tdHeight){
	$("table.imgSizeControl td img").each(function(){
		var width=$(this).attr("width");
		var height=$(this).attr("height");
		dw=tdWidth/width;
		dh=tdHeight/height;
		if(dw<dh){width=width*dw;height=height*dw;}
			else{width=width*dh;height=height*dh;}
		var hspace=(tdWidth-width)/2;
		var vspace=(tdHeight-height)/2;
		$(this).attr({"width":width,"height":height,"hspace":hspace,"vspace":vspace});
	});
}
$(window).load(function(){imgSizeControl(200,100);});//初期値・固定値

前のバージョン
結局画像を読み込んでから操作(readyでなくてload)すればよかっただけで（汗）
HTML(head)

<script src="jquery.js"></script>
<script type="text/javascript" src="jq_imgSizeControl.js"></script>

HTML(body)

<table class="imgSizeControl">

JavaScript (jq_imgSizeControl.js)

/* jq_imgSizeControl.js 2011-01-21→2011-07-31 */
function imgSizeControl(){
	var tdWidth=200;//目的の幅
	var tdHeight=100;//目的の高さ
	$("table.imgSizeControl td img").each(function(){
		var width=$(this).attr("width");
		var height=$(this).attr("height");
		dw=tdWidth/width;
		dh=tdHeight/height;
		if(dw<dh){width=width*dw;height=height*dw;}else{width=width*dh;height=height*dh;}
		var hspace=(tdWidth-width)/2;
		var vspace=(tdHeight-height)/2;
		$(this).attr({"width":width,"height":height,"hspace":hspace,"vspace":vspace});
	});
}
$(window).load(function(){imgSizeControl();});

JavaScript版 (imgSizeControl.js)
※そのページの画像全てに適用される

/* imgSizeControl.js 2010-09-26→2011-03-03 */
function imgSizeControl(){
	var objSizeWidth=100;//目的の幅
	var objSizeHeight=100;//目的の高さ
	for(var i=0;i<document.images.length;i++){
		var width=document.images[i].width;
		var height=document.images[i].height;
		dw=objSizeWidth/width;
		dh=objSizeHeight/height;
		if(dw<dh){width=width*dw;height=height*dw;}else{width=width*dh;height=height*dh;}
		document.images[i].width=width;
		document.images[i].height=height;
		document.images[i].hspace=(100-width)/2;
		document.images[i].vspace=(100-height)/2;
	}
}
window.onload=imgSizeControl;