`

鼠标滚轴事件

 
阅读更多
鼠标滚轴事件
2009/12/30 11:13
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鼠标滚轴事件 -- 关关</title>
</head>

<body>


<div id="iconButton1">dsfsdfsdfsdfsdf</div>
<script type="text/javascript" src="http://demos111.mootools.net/demos/mootools.svn.js"></script>
<script type="text/javascript">
   
window.addEvent('domready', function(){
    var up = $('up'), down = $('down'), log;
  
    [up, down].each(function(arrow) {
     arrow.setStyle('opacity', .1);
    });
  
    document.addEvent('mousewheel', function(event) {
     event = new Event(event);
   
     /* Mousewheel UP */
     if (event.wheel > 0) {
      up.setStyle('opacity', 1);
      down.setStyle('opacity', .1);
      log = 'up';
     }
     /* Mousewheel DOWN*/
     else if (event.wheel < 0) {
      up.setStyle('opacity', .1);
      down.setStyle('opacity', 1);
      log = 'down';
     }
   
     //$('log').setHTML(log);
   
     var cls = function() {
      [up, down].each(function(arrow) {
       arrow.setStyle('opacity', .1);
      });
     }.delay(100);
    });
   });

</script>

<div id="wheel">
<div id="up"><img width="41" height="43" alt="UP" src="http://demos111.mootools.net/demos/Mousewheel/up.gif"/></div>
<div id="down"><img width="41" height="43" alt="DOWN" src="http://demos111.mootools.net/demos/Mousewheel/down.gif"/></div>
</div>
</body>
</html>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics