js动态放大缩小图片

最新推荐文章于 2021-12-07 09:14:54 发布

牛肉干

最新推荐文章于 2021-12-07 09:14:54 发布

阅读量3k

点赞数

分类专栏： JS 文章标签： button html javascript function div

本文链接：https://blog.csdn.net/cchheennhhaaoo119/article/details/2186886

版权

JS 专栏收录该内容

33 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>图片放大缩小</TITLE>
<script language="javascript">
    var oTime;
    function chgSize(args) {
  // 得到页面的图片对象
        var oImg = document.all['oImg'];
        oImg.style.zoom = parseInt(oImg.style.zoom) + (args ? +1 : -1) + '%';
        oTime = window.setTimeout('chgSize(' + args + ')', 100);
    }
</script>
</HEAD>
<BODY>
<div style="overflow: auto; height: 400px; width: 400px; ">
  <img id="oImg" src="a.gif" style="zoom: 100%;">
</div>
<button οnmοusedοwn="chgSize(true);" οnmοuseup="window.clearTimeout(oTime);">放大↑</button>
<button οnmοusedοwn="chgSize(false);" οnmοuseup="window.clearTimeout(oTime);">缩小↓</button>
</BODY>
</HTML>