onmousewheel
縮放圖片效果 復(fù)制此段代碼看看效果就知道怎么用了
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>onMouseWheel Event Sample－ www.51windows.Net</TITLE>
<SCRIPT>
var count = 10;
function Picture()
{
count = Counting(count);
Resize(count);
return false;
}
function Counting(count){
if (event.wheelDelta >= 120)
count++;
else if (event.wheelDelta <= -120)
count--;
return count;
}
function Resize(count){
oImage.style.zoom = count + '0%';
oCounter.innerText = count + '0%';
}
</SCRIPT>
</HEAD>
<BODY bgcolor="#e7d5cd">
<div align=center><h1>onmousewheel event縮放圖片效果</h1>
例子使用onmousewheel事件展示圖片的縮放效果
<br>
將鼠標(biāo)移動到圖片上，并上下滾動鼠標(biāo)軸
<br>
<span style="font-weight:bold">Size =
<span id="oCounter" style="color:red;">100%</span></span>
<a href=http://www.baidu.com/ target=_blank><img id="oImage" src="http://www.jb51.net/logos.gif" onmousewheel="return Picture();" style="cursor:hand" ></a>
</div>
</BODY>
</HTML>
轉(zhuǎn)載于:https://www.cnblogs.com/huanggenying/archive/2007/11/15/960077.html
總結(jié)
以上是生活随笔為你收集整理的onmousewheel的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
