admin 发表于 2022-8-31 07:16:38

【jQuery】鼠标滚轮插件 jquery.mousewheel.js的基本使用

jQuery Mousewheel |jQuery Plugin Registry
GitHub - jquery/jquery-mousewheel: A jQuery plugin that adds cross-browser mouse wheel support.
jquery.mousewheel.js 是一个用于添加跨浏览器的鼠标滚轮支持的 jQuery 插件。

一、使用该插件,需要把 mousewheel 事件绑定到一个元素上即可。当然也可以使用类似 jQuery 中其他的事件方法写法。
例如:

// 方式1:using on

$('#某个元素').on('mousewheel', function(event) {

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

});

// 方式2:using the event helper

$('#某个元素').mousewheel(function(event) {

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

});

二、事件对象中可以获取如下三个属性值:

deltaX:值为负的(-1),则表示滚轮向左滚动。值为正的(1),则表示滚轮向右滚动。
deltaY:值为负的(-1),则表示滚轮向下滚动。值为正的(1),则表示滚轮向上滚动。
deltaFactor:增量因子。通过 deltaFactor * deltaX 或者 deltaFactor * deltaY 可以得到浏览器实际的滚动距离。
三、如果想要对整个窗口进行滚轮事件监听,可以将监听添加在 window 上。

$(window).mousewheel(function(event) {

   // do something

});
页: [1]
查看完整版本: 【jQuery】鼠标滚轮插件 jquery.mousewheel.js的基本使用