이미지를 마우스로 크기 조정가능하게

이미지를 마우스로 크기 조정가능하게 > 그누3 팁자료실

그누3 팁자료실

이미지를 마우스로 크기 조정가능하게 정보

javascript 이미지를 마우스로 크기 조정가능하게

카이루 홈페이지 자기소개 아이디로 검색 회원게시물 (61.♡.♡.127)
2004.09.21 00:20:15
2,055

첨부파일

11.html (1.8K) 116회 다운로드 2004-09-21 00:20:15

본문

<script language="JavaScript">
// 이미지의 디폴트 사이즈를 설정 합니다
defaultXsize = 100; // 가로
defaultYsize = 100; // 세로

// 이미지의 최소 크기를 설정 합니다
minimumXsize = 50;
minimumYsize = 50;

// 이미지의 최대사이즈를 설정 합니다
maximumXsize = 250;
maximumYsize = 250;

iBeReady = false;

function dragResizeImage(dragEvent,which){
if (iBeReady){
posX = eval("document."+which+".offsetLeft");
posY = eval("document."+which+".offsetTop");
newXsize = dragEvent.x;
newYsize = dragEvent.y;
newXsize = newXsize - posX;
newYsize = newYsize - posY;
if (newXsize >= maximumXsize) newXsize = maximumXsize;
if (newYsize >= maximumYsize) newYsize = maximumYsize;
if (newXsize <= minimumXsize) newXsize = minimumXsize;
if (newYsize <= minimumYsize) newYsize = minimumYsize;
eval("document."+which+".width=newXsize");
eval("document."+which+".height=newYsize");
}
}

function clickResetImageSize(which){
if (iBeReady){
eval("document."+which+".width=defaultXsize");
eval("document."+which+".height=defaultYsize");
}
}

</script>



</HEAD>



<body onload="iBeReady=true;">



<p><b>마우스로 이미지 크기를 조절 해 보세요</b></p>



<img src="../img6.jpg"
name="imageOne"
width="100" height="100"
onDrag="dragResizeImage(event,this.name)"
onClick="clickResetImageSize(this.name)">



</BODY>