一\先在HTML里增加图片,并定义好ID号:
<div style="height: 400px; overflow: auto;">
<span id="p"></span>
<img id="oImg" src="http://www.blueidea.com/gg/wacom/q1.gif" style="zoom: 100%;" class="dragme">
</div>
二\放入放大缩小按钮
<button onmousedown="chgSize(true);" onmouseup="window.clearTimeout(oTime);">↑</button>
<button onmousedown="chgSize(false);" onmouseup="window.clearTimeout(oTime);">↓</button>
三\写调用函数
<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 + ')', 1);
}
</script>
说明:当缩标按下时(onmousedown)执行chgSize(),鼠标松开(onmouseup)清除时间window.clearTimeout(oTime);
parseInt(oImg.style.zoom) + (args ? +1 : -1) + '%';
当放大为真是点击一下放大一个像素,,反之,则减小.