JS图片的放大与缩小

<!doctype html>
<head>
<meta charset=utf-8" />
<title>javascript控制图片缩小或者放大</title>
</head>
<body>
<script type="text/javascript">
var oTime;
function changeSize(id,action){
   var obj=document.getElementById(id);
   obj.style.zoom=parseInt(obj.style.zoom)+(action=='+'?+10:-10)+'%';
   oTime=window.setTimeout('changeSize(\''+id+'\',\''+action+'\')',100);
   }
   document.onmouseup=function(){
   window.clearTimeout(oTime);
   }
   </script>
<div style="height: 200px; overflow: auto;">
   <img id="headImg" src="http://www.phpernote.com/images/logo.gif" width="67" height="55" style="zoom: 100%;"></div>
   <button onmousedown="changeSize('headImg','+');" onmouseup="window.clearTimeout(oTime);">放大</button>
   <button onmousedown="changeSize('headImg','-');" onmouseup="window.clearTimeout(oTime);">缩小</button>
   </body>
   </html>

巴特西

JS图片的放大与缩小

最新文章

热门文章