[javascript] Image Resize Function만들기

이미지  tag

<img src="조회할 이미지URL" onload="javascript:fitImageSize(this, '조회할 이미지URL', 60, 60);" 

style="display:none" >

처리 하는 javascript

function fitImageSize(obj, href, maxWidth, maxHeight) {

	var image = new Image();

	image.onload = function(){
	
		var width = image.width;
		var height = image.height;
		
		var scalex = maxWidth / width;
		var scaley = maxHeight / height;
		
		var scale = (scalex < scaley) ? scalex : scaley;
		if (scale > 1) 
			scale = 1;
		
		obj.width = scale * width;
		obj.height = scale * height;
		
		obj.style.display = "";
	}
	image.src = href;
}

참고: http://charism.tistory.com/44

기타

///*## imageFit common #####*/

function imageFitResize(img_url, mainWidth, mainHeight){

var obj = new Object();

///* 사이즈 조절

var  tmpImage = new Image();

tmpImage.src = img_url;

var naturalWidth = tmpImage.width;//로컬 값은 0으로 나타남

var naturalHeight = tmpImage.height;//로컬 값은 0으로 나타남

var scalex = mainWidth / naturalWidth;

var scaley = mainHeight / naturalHeight;

var scale = (scalex < scaley) ? scalex : scaley;

if (scale > 1)

scale = 1;

obj.width = scale * naturalWidth;

obj.height = scale * naturalHeight;

//new Image() 객체 예외처리

if (obj.width < 1 || obj.height < 1) {

obj.width = mainWidth;

obj.height = mainHeight;

}

return obj;

}

//function imageFitResize(img_url, mainWidth, mainHeight){

// var obj = new Object();

//

// ///* 사이즈 조절

// var  tmpImage = new Image();

// tmpImage.src = img_url;

//

// var naturalWidth = mainWidth;

// var naturalHeight = mainHeight;

//

// tmpImage.onload = function(){

//

// naturalWidth = tmpImage.width;

// naturalHeight = tmpImage.height;

//

// console.log('naturalWidth:'+naturalWidth);

//

// var scalex = mainWidth / naturalWidth;

// var scaley = mainHeight / naturalHeight;

//

// var scale = (scalex < scaley) ? scalex : scaley;

// if (scale > 1)

// scale = 1;

//

// obj.width = scale * naturalWidth;

// obj.height = scale * naturalHeight;

//

// }

//

// console.log('obj.width:'+obj.width);

// return obj;

//

//}