這篇文章主要介紹了js實(shí)現(xiàn)鼠標(biāo)滾輪控制圖片縮放效果的方法,涉及onmousewheel事件及javascript操作圖片的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
本文實(shí)例講述了js實(shí)現(xiàn)鼠標(biāo)滾輪控制圖片縮放效果的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下:
代碼如下:
<!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>用鼠標(biāo)滾輪滾動(dòng)控制圖片的縮小放大</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>將鼠標(biāo)放在圖片上,點(diǎn)擊一下,然后滾動(dòng)鼠標(biāo)滾輪試試看</p>
<p><img border="0" src="/images/m01.jpg" onmousewheel="return bbimg(this)"></p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
更多信息請(qǐng)查看IT技術(shù)專欄