这篇文章主要介绍了js实现鼠标滚轮控制图片缩放效果的方法,涉及onmousewheel事件及javascript操作图片的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了js实现鼠标滚轮控制图片缩放效果的方法。分享给大家供大家参考。具体实现方法如下：
代码如下:
<!doctype html public -//w3c//dtd xhtml 1.0 transitional//en >
<html xmlns=>
<head>
<meta http-equiv=content-language content=zh-cn />
<meta http-equiv=content-type content=text/html; charset=gb2312 >
<title>用鼠标滚轮滚动控制图片的缩小放大</title>
<script language=javascript>
function bbimg(o){
var zoom=parseint(o.style.zoom, 10)||100;
zoom+=event.wheeldelta/12;
if (zoom>0) o.style.zoom=zoom+'%';
return false;
}
</script>
</head>
<body>
<p>将鼠标放在图片上，点击一下，然后滚动鼠标滚轮试试看</p>
<p><img border=0 src=/images/m01.jpg onmousewheel=return bbimg(this)></p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>
希望本文所述对大家的javascript程序设计有所帮助。