<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>图片鼠标滚轮缩放</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Generator" content="Dreamweaver8" />
<meta name="Author" content="枫叶随风 QQ:455948725 E-mail:liukun615@126.com" />
<link rel="shortcut icon" href="http://www.fengyekun.com/favicon.ico" />
<style type="text/css">
<!--
body {font-family:"宋体", Arial, Helvetica, sans-serif; margin:0px; font-size:12px;}
#main {width:100%;}
#content {position:relative; top:50%; margin:-150px auto; width:500px; height:300px; border:1px solid #999; background:#eee; overflow:hidden;}
-->
</style>
<script language="javascript" type="text/javascript">
function ZoomImage(ImageID){
var Zoom = parseInt(ImageID.style.zoom) || 100;
Zoom += event.wheelDelta/12;
if (Zoom>=100) ImageID.style.zoom=Zoom+"%";
}
</script>
</head>
<body>
<div id="main">
<div id="content"><img onmousewheel="ZoomImage(this)" src="/TempFolder/4.jpg" width="120" height="90" /></div>
</div>
<script language="JavaScript" type="text/javascript">document.getElementById("main").style.height=document.documentElement.clientHeight+"px";</script>
</body>
</html>
实例演示：http://www.fengyekun.com/Study_712.html
