JavaScript定义按钮控制图片放大缩小显示

此代码仅供参考

---

代码说明

网页上有一个按钮，Js为其添加动作，让其来控制图片的放大和缩小显示。鼠标点击放大按钮后，图片则会放大显示，每点击一次放大不同的倍数，位数自定义便可。反之，则点击一次缩小一下图片，兼容主流浏览器。

---

html代码

<p align="center"> <input type="button" value="放大" onclick="blowup()"> <input type="button" value="缩小" onclick="reduce()"> </p> <table WIDTH="300" BORDER="0" ALIGN="CENTER"> <tr> <td><div align="center"> <input NAME="images1" TYPE="image" ID="images1" SRC="/jscss/demoimg/wall8.jpg" ALIGN="MIDDLE" BORDER="0"> </div></td> </tr> </table> <p> <script language="javascript"> function blowup() { var height = images1.height; var width = images1.width; if ((height <= height * 2)||(width <= width * 2)) { images1.height = images1.height + 20; images1.width = images1.width + 20; } } function reduce() { if ((images1.width > 100)||(images1.height > 100)) { images1.height = images1.height - 20; images1.width = images1.width - 20; } } </script> </p> <div ALIGN="CENTER"></div>

---

代码演示

---

---