龙空技术网

JavaScript 滚轮(卷动)事件

寒笛过霜天 49

前言:

而今同学们对“js触发滚轮事件”大体比较看重,看官们都需要剖析一些“js触发滚轮事件”的相关内容。那么小编同时在网上收集了一些有关“js触发滚轮事件””的相关文章,希望兄弟们能喜欢,大家一起来学习一下吧!

滚轮事件:滚轮

滚动(卷动)事件:滚轮、拖拽滚动条、键盘方向键

<script type="text/javascript">//滚轮事件:滚轮//卷动事件:滚轮、拖拽滚动条、键盘↕键//IE和Chromegunlun.onmousewheel = function(){this.innerHTML += "IE和Chrome<br/>";}//Firefoxgunlun.addEventListener("DOMMouseScroll", function(){this.innerHTML += "Firefox<br/>";})</script>

判断滚轮方向

<script type="text/javascript">//滚轮事件:滚轮//卷动事件:滚轮、拖拽滚动条、键盘↕键//IE和Chromegunlun.onmousewheel = function(e){var ev = e || window.event;console.log(ev.wheelDelta);//判断滚轮方向的//上120//下-120this.innerHTML += "IE和Chrome<br/>";}//Firefoxgunlun.addEventListener("DOMMouseScroll",function(e){var ev = e || window.event;console.log(ev.detail);//滚轮方向//上-3//下3this.innerHTML += "Firefox<br/>";})</script>

兼容性封装

<script type="text/javascript">//滚轮事件:滚轮//卷动事件:滚轮、拖拽滚动条、键盘↕键//IE和Chromegunlun.onmousewheel = gl;//Firefoxgunlun.addEventListener("DOMMouseScroll",gl)function gl(e){var dir;//事件对象的兼容var ev = e || window.event;if(ev.wheelDelta){//IE和Chromedir = ev.wheelDelta>0?"上":"下";}else if(ev.detail){//FireFoxdir = ev.detail>0?"下":"上";}console.log(dir)}</script>

标签: #js触发滚轮事件