您现在的位置: 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文

js鼠标滑轮滚动事件绑定的简单实例

作者:佚名    责任编辑:admin    更新时间:2022-06-22

 本篇文章主要介绍了js鼠标滑轮滚动事件绑定的简单实例(兼容主流浏览器)。需要的朋友可以过来参考下,希望对大家有所帮助

 代码如下: /** Event handler for mouse wheel event.           *鼠标滚动事件           */           var wheel = function(event) {               var delta = 0;               if (!event) /* For IE. */                   event = window.event;               if (event.wheelDelta) { /* IE/Opera. */                   delta = event.wheelDelta / 120;               } else if (event.detail) {                   /** Mozilla case. */                   /** In Mozilla, sign of delta is different than in IE.                   * Also, delta is multiple of 3.                   */                   delta = -event.detail / 3;               }               /** If delta is nonzero, handle it.               * Basically, delta is now positive if wheel was scrolled up,               * and negative, if wheel was scrolled down.               */               if (delta)                   handle(delta);               /** Prevent default actions caused by mouse wheel.               * That might be ugly, but we handle scrolls somehow               * anyway, so don't bother here..               */               if (event.preventDefault)                   event.preventDefault();               event.returnValue = false;           }             /** Initialization code.            * If you use your own event management code, change it as required.           */           if (window.addEventListener) {               /** DOMMouseScroll is for mozilla. */               window.addEventListener('DOMMouseScroll', wheel, false);           }           /** IE/Opera. */           window.onmousewheel = document.onmousewheel = wheel;             /** This is high-level function.           * It must react to delta being more/less than zero.           */           var handle = function(delta) {               var random_num = Math.floor((Math.random() * 100) + 50);               if (delta < 0) {                   // alert("鼠标滑轮向下滚动:" + delta + "次!"); // 1                   $("btn_next_pic").onclick(random_num);                   return;               } else {                   // alert("鼠标滑轮向上滚动:" + delta + "次!"); // -1                   $("btn_last_pic").onclick(random_num);                   return;               }           }