网络编程
位置:首页>> 网络编程>> JavaScript>> onmousewheel event 缩放图片效果

onmousewheel event 缩放图片效果

  发布时间:2023-07-02 04:55:50 

标签:onmousewheel,event,缩放图片效果
<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>  <h1>onmousewheel event</h1>  <P>  This sample uses the onmousewheel event to expand or contract the picture below.   Move the cursor over the picture and roll the mouse wheel up and down.</P>  Size =  100%    <img id="oImage" src="https://www.aspxhome.com/logos.gif" onmousewheel="return Picture();" >        http://msdn.microsoft.com/workshop/samples/author/dhtml/refs/onmousewheelEX.htm.  </BODY>  </HTML>  <div style="position: absolute; top: 10; right: 10; width: 148; height: 18;cursor:hand">  <input type="button" name="Button" value="查看源代码" onClick= 'window.location = "view-source:" + window.location.href'></div>


0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com