失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > html鼠标滚轮监听 jQuery - 鼠标滚轮插件jquery.mousewheel.js详解(上下 左右滚动监听)...

html鼠标滚轮监听 jQuery - 鼠标滚轮插件jquery.mousewheel.js详解(上下 左右滚动监听)...

时间:2018-12-11 14:24:33

相关推荐

html鼠标滚轮监听 jQuery - 鼠标滚轮插件jquery.mousewheel.js详解(上下 左右滚动监听)...

1,插件介绍

jquery.mousewheel.js是一个用于添加跨浏览器的鼠标滚轮支持的 jQuery插件。

2,使用说明

(1)使用该插件,只需将 mousewheel事件绑定到一个元素上即可。当然也可以使用类似 jQuery中其他的事件方法写法。下面列出这两种方式:

// 方式1:using on

$(#my_elem).on(mousewheel, function(event) {

console.log(event.deltaX, event.deltaY, event.deltaFactor);

});

// 方式2:using the event helper

$(#my_elem).mousewheel(function(event) {

console.log(event.deltaX, event.deltaY, event.deltaFactor);

});

(2)事件对象中可以获取如下三个属性值:

deltaX:值为负的(-1),则表示滚轮向左滚动。值为正的(1),则表示滚轮向右滚动。

deltaY:值为负的(-1),则表示滚轮向下滚动。值为正的(1),则表示滚轮向上滚动。

deltaFactor:增量因子。通过 deltaFactor * deltaX 或者deltaFactor * deltaY 可以得到浏览器实际的滚动距离。

(3)如果想要对整个窗口进行滚轮事件监听,可以将监听添加在 window上。

$(window).mousewheel(function(eve

如果觉得《html鼠标滚轮监听 jQuery - 鼠标滚轮插件jquery.mousewheel.js详解(上下 左右滚动监听)...》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。