图片的放大与缩小

最新推荐文章于 2021-04-15 20:20:21 发布

kyrin_云中鹤

最新推荐文章于 2021-04-15 20:20:21 发布

阅读量754

点赞数

web开发专栏收录该内容

60 篇文章

订阅专栏

<script language="javascript">
    var oTime;
    function chgSize(args) {
        var oImg = document.all('oImg');
		
		//将图片的缩小预防大锁定到10%~150%之间
        oImg.style.zoom =(( parseInt(oImg.style.zoom)<10?10: parseInt(oImg.style.zoom))>150?150:( parseInt(oImg.style.zoom)<10?10: parseInt(oImg.style.zoom))	)	+   (args ? +1 : -1)  + '%';
		
		
        oTime = window.setTimeout('chgSize(' + args + ')', 10);
    }    
document.onmouseup = function() {
window.clearTimeout(oTime);
}  
</script>
<div style="height: 200px; overflow: auto;">
<img id="oImg" src="1.jpg"   style="zoom: 100%;"/>
</div>
<input type=button οnmοusedοwn="chgSize(true);" οnmοuseup="window.clearTimeout(oTime);" Value=↑>
<input type=button οnmοusedοwn="chgSize(false);" οnmοuseup="window.clearTimeout(oTime);" Value=↓>

运行截图如下：