jquery判断鼠标上下滚动插件jquery.mousewheel.js
mousewheel.js是一个delta
规范化、跨浏览器监听鼠标上下滚动的jquery插件,支持IE6+、Firefox、Chrome、Safari浏览器。
通过mousewheel.js插件可以判断鼠标滚轮是向上还是向下滚动、往左还是往右滚动,插件支持mousewheel
和unmousewheel
,通俗地理解即启用插件功能和关闭插件功能的意思。
插件Github主页:https://github.com/jquery/jquery-mousewheel
使用插件功能:
方式一:使用on调用
// using on $('#element').on('mousewheel', function(event) { console.log(event.deltaX, event.deltaY, event.deltaFactor); if(event.deltaY < 0){ alert('正向下滚动'); }else{ alert('正向上滚动'); } });
方式二:使用事件
// using the event helper $('#element').mousewheel(function(event) { console.log(event.deltaX, event.deltaY, event.deltaFactor); if(event.deltaY < 0){ alert('正向下滚动'); }else{ alert('正向上滚动'); } });
插件参数:
- event.deltaX - 值为负则表示滚轮向左滚动,值为正表示滚轮向右滚动。
- event.deltaY - 值为负表示滚轮向下滚动。值为正表示滚轮向上滚动。
-
event.deltaFactor - 增量因子,通过
deltaFactor * deltaX
和deltaFactor * deltaY
可以获取浏览器实际的滚动距离。
关闭插件功能:
$('#element').unmousewheel();
默认不启用:
$('#element').unbind('mousewheel');
javascript代码实现请参考:js鼠标滑轮滚动监听触发事件
<< 上一篇
下一篇 >>