jquery.mousewheel.js 是一个监听浏览器的鼠标滚轮事件的 jQuery 插件-BFW插件库

jquery.mousewheel.js 是一个监听浏览器的鼠标滚轮事件的 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);
});

事件对象中可以获取如下三个属性值：
deltaX：值为负的（-1），则表示滚轮向左滚动。值为正的（1），则表示滚轮向右滚动。
deltaY：值为负的（-1），则表示滚轮向下滚动。值为正的（1），则表示滚轮向上滚动。
deltaFactor：增量因子。通过 deltaFactor * deltaX 或者 deltaFactor * deltaY 可以得到浏览器实际的滚动距离。

$(window).mousewheel(function(event) {
   console.log(event.deltaX, event.deltaY, event.deltaFactor);
});

第一步引入bfwone

第二步执行插件代码

示例如下：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" data="dep=jquery.17&err=0" type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        bready(function() {
            use(["jquery.mousewheel.min"], function() {
                $('#scrolldiv')

                .mousewheel(function(event, delta) {

                    //
                    console.log(event);
                    console.log(delta);
                    event.preventDefault();

                });
            });
        });
    </script>
    <style>
        #scrolldiv {
            width: 100%;
            height: 2000px;
        }
    </style>
</head>
<body>
    <div id="scrolldiv">
        滚定鼠标试试，看console

    </div>
</body>
</html>