使用JS监听鼠标滚轮事件，并且滑动一次只执行一次事件方法

迷南。 2022-06-12 06:51 416阅读 0赞

使用JS监听鼠标滚轮事件，并且滑动一次只执行一次事件方法

function autoRoll() { 
            $(document).on("mousewheel DOMMouseScroll", function(e) { 
                var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? 1 : -1)) || // chrome & ie
                    (e.originalEvent.detail && (e.originalEvent.detail > 0 ? -1 : 1)); // firefox
                $(document).off("mousewheel DOMMouseScroll");
                if (delta > 0) {
                    // 向上滚
                    num -= 1;
                    if (num < 0) {
                        num = 0;
                    }
                    //要执行的方法
                } else if (delta < 0) {
                    // 向下滚
                    num += 1;
                    if (num > 4) {
                        num = 0;
                    }
                   //要执行的方法
                }
                //使用setTimeout方法产生一个延时效果，是的每次滑动鼠标滑轮，只执行一次事件方法
                setTimeout(autoRoll, 500);
    
            });
        }
        autoRoll();

发表评论取消回复

表情：

评论列表（有 0 条评论，416人围观）

还没有评论，来说两句吧...

相关阅读

相关 Java一定时间后执行一次任务，只执行一次

import lombok.extern.slf4j.Slf4j; import org.springframework.stereotype.Componen

以你之姓@/ 2024年03月24日 09:54/ 0 赞/ 44 阅读

相关 componentDidMount只执行一次的解决方法

一、前言最近写react antd前端项目，需要页面加载时调用下查询列表的接口。于是在`componentDidMount`方法里这样写了： compon

偏执的太偏执、/ 2024年02月20日 09:20/ 0 赞/ 72 阅读

相关使用JS监听鼠标滚轮事件，并且滑动一次只执行一次事件方法

使用JS监听鼠标滚轮事件，并且滑动一次只执行一次事件方法 function autoRoll() { $(document).on("mou

迷南。/ 2022年06月12日 06:51/ 0 赞/ 417 阅读

相关鼠标滚轮事件

要达到效果是，滚动鼠标到一定距离，导航条出现，没有达到这个高度，滚动条消失鼠标滚轮监听需要用到插件 jquery.mousewheel.min.js v

我就是我/ 2022年06月01日 21:19/ 0 赞/ 642 阅读

相关动态添加的元素，设置监听事件；input：text事件只触发一次

之前上网搜索过，好像高版本的jquery就把bind，live等等这些都抛弃掉了。都要统一使用on来控制监听。总之，我对动态添加的元素设置监听，发现就on函数好使。代码如下

缺乏、安全感/ 2022年06月01日 13:20/ 0 赞/ 194 阅读

相关 JS控制页面只刷新一次!!一次!!!!

让页面进行刷新，可以使用location.reload()方法，但是这种方法会让页面一直不断的刷新，这是因为当页面加载完成以后，我们让它刷新一次，那么浏览器就会重新向服务器请求

绝地灬酷狼/ 2022年03月09日 15:24/ 0 赞/ 1026 阅读

相关 js计时器setInterval（）只执行一次

今天做了一个倒计时的案例，代码如下: function clock() { var nowTime = new Date();

今天药忘吃喽~/ 2022年01月28日 09:49/ 0 赞/ 372 阅读

相关鼠标滚轮事件

做一个用鼠标滚轮控制图片放大缩小的简单功能。 1.滚动时页面也会跟随滚动e.preventDefault()去掉默认事件。 2.Chrome、IE等浏览器，用mousewh

迷南。/ 2021年11月02日 02:14/ 0 赞/ 467 阅读

相关 JavaScript中监听鼠标滚轮事件

使用jQuery监听鼠标滚轮事件： <!DOCTYPE html> <html> <head> <meta charse

谁借莪１个温暖的怀抱￠/ 2021年10月18日 11:48/ 0 赞/ 527 阅读

相关 js事件执行多次，只执行最后一次

可以使用定时器解决！ //写在事件外边，防止被注销 var iTime; /筛选过滤/ $('input.column_

逃离我推掉我的手/ 2021年07月26日 11:26/ 0 赞/ 701 阅读