在这里我们带领大家来使用javaScript实现图片的放大和缩小。实现的效果图如下
点击放大按钮，图片会放大，当放大到一定程度的时候，图片不能再放大，会弹出一个提示框，不能再放大了，点击缩小按钮，图片会缩小，当缩小到一定程度的时候，图片不能再缩小，会弹出一个提示框，不能再缩小了。
下面我们先来实现界面的布局。
点击按钮图片进行缩放，可以看出需要将图片和按钮放置在一个div里面。
布局代码如下：
1、实现点击放大按钮，图片放大
实现分为以下几步：
1.获取放大按钮以及图片
通过getElementById方法获取放大按钮以及图片，然后设置按钮的点击事件onclick。
2.实现放大按钮的onclick事件
在该事件中，需要设置图片每次点击后的宽度和高度，设置为该图片本身宽度和高度的1.2倍，实现代码如下
var endW=image.width*1.2;//每次点击后的宽度
var endW=image.width*1.2;//每次点击后的高度
这里需要设置定时器，每隔20ms，图片放大一次，此时需要判断，如果图片的宽度小于endW，点击放大按钮的时候，图片宽度和高度每次增大1.05倍否则。但是这样的话点击放大按钮时，图片会无限制放大。
3.限制图片放大
设置图片放大的极限值，分别为图片宽度和高度的2倍
var maxW=image.width*2;//放大宽度的极限值
var maxH=image.height*2;//放大高度的极限值
在判断的时候加入当图片的宽度小于极限值的时候，图片放大，否则弹出对话框“图片不能再放大”
2、实现点击缩小按钮，图片缩小
实现原理和放大类似。这里将代码贴出来，大家可以认真看一下
完整代码
