JS检测屏幕(鼠标或触屏)滚动方向

原理:window/document对象的mousewheel事件

var scrollFunc = function (e) {    
var direct = 0;    
e = e || window.event;    
if (e.wheelDelta) {  
//判断浏览器IE,谷歌滑轮事件        
if (e.wheelDelta > 0) { //当滑轮向上滚动时            
console.log("滑轮向上滚动");        
}       
 if (e.wheelDelta < 0) { //当滑轮向下滚动时           
console.log("滑轮向下滚动");        }    
} 
else if (e.detail) {  //Firefox滑轮事件       
 if (e.detail> 0) { //当滑轮向上滚动时            
console.log("滑轮向上滚动");        }        
if (e.detail< 0) { //当滑轮向下滚动时            
console.log("滑轮向下滚动");        }   
 }
};
//给页面绑定滑轮滚动事件if (document.addEventListener) {
    document.addEventListener('DOMMouseScroll', scrollFunc, false);
}
//滚动滑轮触发scrollFunc方法
window.onmousewheel = document.onmousewheel = scrollFunc;

推荐阅读更多精彩内容

  • 介绍JavaScript的基本数据类型。 ECMAScript中有5中简单数据类型(也称为基本数据类型): Und...
    过往的雨阅读 658评论 0 1
  • @(汇总)[js] 基础 Javascript是一种弱类型语言,它分别有什么优点和缺点 弱类型语言:简单好用,更灵...
    _Yfling阅读 1,135评论 0 6
  • 第一部分 准入训练 第1章 进入忍者世界 js开发人员通常使用js库来实现通用和可重用的功能。这些库需要简单易用,...
    如201608阅读 1,125评论 6 2
  • 2016年的最后一天,睡了半天觉,加了半天班,收拾东西准备搬家,这一年总算过去了,见识了不少,成长了很多。在自己的...
    烟涩寒阅读 185评论 0 0
  • “我们只能走在幻夜的路上,即使四周明亮有如白昼。 那也仅是假象。 就像与你共度的每个夜晚都是幻夜,...
    静初wld阅读 206评论 0 1
  • 1.不提供免费教育 2.朽木不可雕也 3.不与傻x论短长 4.不可与夏虫语冰
    Risycal阅读 73评论 0 0
  • 昨晚,在研究涂涂乐。 哈哈,各位亲们,试验成功。。。。给大家秀一下。 原来的电脑桌: 见证奇迹的时刻到了。。。 哈...
    木质为坚阅读 322评论 0 0