<div class="htmlarea"> <textarea id="runcode59862"> <title>에뮤</title> 원본 그림: <img src="http://www.web745.com/image/logo.gif" style="max-width:90%" style="max-width:90%" id="srcImg" onmousemove="zoom()" alt="자바스크립트를 사용하여 돋보기를 만들어 사진_이미지 특수 효과 확대" > 부분 확대: <div style="overflow:hidden"><img id="zoomImg" alt="자바스크립트를 사용하여 돋보기를 만들어 사진_이미지 특수 효과 확대" ></div> </textarea> <br><input onclick="runEx('runcode59862')" type="button" value="运行代码"><input onclick="doCopy('runcode59862')" type="button" value="复制代码"> <input onclick="doSave(runcode59862)" type="button" value="保存代码"> <a href="http://www.jb51.net/article/23421.htm" title="查看具体详情" target="_blank">[Ctrl A 모두 선택 참고: </a>외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다 </div>]<script language="JavaScript"> <!-- zoomImg.src = srcImg.src; srcImg.height = srcImg.height/2; var zoomRate = 5; //放大倍数 zoomImg.height = srcImg.height*zoomRate; zoomImg.parentNode.style.width = srcImg.width; zoomImg.parentNode.style.height = srcImg.height; function zoom(){ var elm = event.srcElement; h = elm.offsetHeight/zoomRate/2; w = elm.offsetWidth/zoomRate/2; var x = event.x-elm.offsetLeft; x=x<(elm.offsetWidth-w)?x<w?w:x:elm.offsetWidth-w; zoomImg.style.marginLeft=(w-x)*zoomRate; var y = event.y-elm.offsetTop; y=y<(elm.offsetHeight-h)?y<h?h:y:elm.offsetHeight-h; zoomImg.style.marginTop=(h-y)*zoomRate; } //--> </script>