반응형
스크립트로 이미지 사이즈를 조정

스크립트를 이용해서 화면에 보여줄 이미지의 크기를 변경하는 소스입니다..  

저같은경우 사진자료실이 있는데 사진자료실의 이미지가 테이블 크기보다 크게되면 사이즈를 줄이는 용도로

만들었습니다..

<script>
function imgSize(which){
    var width = eval("document."+which+".width");
    var height = eval("document."+which+".height");
    var temp = 0;
    var max_width= 600;   // 이미지의 최대 크기    
   
    if ( width > max_width ) {  // 이미지가 600보다 크다면 너비를 600으로 맞우고 비율에 맞춰 세로값을 변경한다.      
       height = height/(width / max_width);
       eval("document."+which+".width = max_width");    
       eval("document."+which+".height = height");
    }    
}
</script>

<html>
<body>
<table>
<tr>
<td width=100 >사진</td>
<td > <img src="../cl_upload/sajin/<%=v_file_nm%>" border=0 name="img"></td>
</tr>
</table>
<script>imgSize("img");</script>
</body>
</html>

!! 주의 할점 :  함수를 호출할때 꼭 이미지가 들어간 테이블밖에서 실행해야
실행됩니다. 테이블을 이용하지 않는다면 바디테그 이후에 넣어줘야 합니다.
간단한 소스인데도. . 찾기가 힘드네여.-_-;

//PHP에서 가져 온거

function UploadImage(iw,ih,j){
alert("");
iWidth=parseInt(eval("document.image"+j+".width"));
iHeight=parseInt(eval("document.image"+j+".height"));
if(iWidth>parseInt(iw) && iWidth>=iHeight){
eval('document.image'+j+'.height=parseInt(iw)/iWidth*iHeight;');
eval('document.image'+j+'.width=parseInt(iw);');
}
if(iHeight>parseInt(ih) && iHeight>iWidth){
eval('document.image'+j+'.width=parseInt(ih)/iHeight*iWidth;');
eval('document.image'+j+'.height=parseInt(ih);');
}
eval('document.image'+j+'.style.visibility="visible";');
}


//


<img src="testimg.gif" name="image1" style="visibility:visible;" onClick="UploadImage('20','30',1)">


참조:http://phpschool.com/bbs2/inc_view.html?id=14193&code=htmlscript2&start=20&mode=search&field=body&search_name=&operator=and&period=all&category_id=&s_que=%C0%CC%B9%CC%C1%F6%2C%C5%A9%B1%E2


반응형

'프로그래밍 > JAVASCRIPT' 카테고리의 다른 글

[JAVA SCRIPT] WINDOW.OPEN  (0) 2010.09.01
브라우저 정보 알아오기.  (0) 2010.07.20
Textarea에 현제 글자(문자)의 바이트 수를 알아오기  (0) 2010.07.13
Textarea 글자수제한.  (0) 2010.07.13
escape메서드  (0) 2010.07.07

+ Recent posts