其他分享
首页 > 其他分享> > vue监听鼠标滚轮滚动方向

vue监听鼠标滚轮滚动方向

作者:互联网

第一步 现在挂在里添加一个事件监听

 mounted(){
    //监听鼠标滚动事件
    window.addEventListener( this.menu, true)||window.addEventListener(this.menu,false)
  },

第二步就是逻辑

这个写在methods里面

menu(e) {
      e = e || window.event;
      if (e.wheelDelta) {  //判断浏览器IE,谷歌滑轮事件
        if (e.wheelDelta > 0) { //当滑轮向上滚动时
          alert("滑轮向上滚动");
        }
        if (e.wheelDelta < 0) { //当滑轮向下滚动时
          alert("滑轮向下滚动");
        }
      }
      else if (e.detail) {  //Firefox滑轮事件
        if (e.detail> 0) { //当滑轮向上滚动时
          alert("滑轮向上滚动");
        }
        if (e.detail< 0) { //当滑轮向下滚动时
          alert("滑轮向下滚动");
        }
      }

      },

效果

 

标签:滚轮,vue,滚动,鼠标,menu,detail,alert,window,滑轮
来源: https://blog.csdn.net/yy6818/article/details/120255898