美文网首页
js 监听浏览器不滚动事件

js 监听浏览器不滚动事件

作者: GrowthCoder | 来源:发表于2019-04-27 15:47 被阅读0次

添加定时器,每次滚动事件先清除上个定时器,再添加新的定时器,比如说,浏览器3秒没发生滚动,3秒后则会触发定时器回调事件,进而获取到没有滚动事件。

mounted() {
    window.addEventListener('scroll', this.handleScroll);
},
handleScroll() {
    const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
    const titleTop = document.querySelectorAll('.c-panel-heading')[1].offsetTop;
    
    clearTimeout(countTimer);
    // 浏览器3秒内未滚动 则停止计时
    countTimer = setTimeout(this.isScrollEnd, 3000);
    this.taskPos.startScrollTop = parseInt(scrollTop);
},
isScrollEnd() {
    const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
    this.taskPos.endScrollTop = parseInt(scrollTop);
    if (this.taskPos.startScrollTop === this.taskPos.endScrollTop) {
        // 获取到不滚动状态
       // 业务逻辑
        this.taskView.stopCountDown = true;
    }
},

相关文章

  • js 监听浏览器不滚动事件

    添加定时器,每次滚动事件先清除上个定时器,再添加新的定时器,比如说,浏览器3秒没发生滚动,3秒后则会触发定时器回调...

  • react-native ScrollView的吸顶效果

    一、基本布局 二、实现 js 滚动监听事件

  • 2017-3-15 JS 学习笔记

    滚动事件的认识 实际开发中,我们经常需要监听滚动事件 滚动事件一般是由 window 来触发 不同浏览器中获取滚动...

  • JS简易整页滚动

    fullPage超简易版本 1.知识点 JS 滚动监听事件 JS 移动端touch监听事件 函数节流 DOM操作 ...

  • js 防抖 节流 JavaScript

    js 防抖 节流 JavaScript 实际工作中,通过监听某些事件,如scroll事件检测滚动位置,根据滚动位置...

  • 函数防抖与函数节流

    前言 有一些浏览器事件我们不希望它很频繁的触发,如调整窗口大小(onresize)、监听滚动条滚动(onscrol...

  • ajax

    js中的事件。 js对浏览器,鼠标发生的一些列动作的监听。 比如鼠标的监听事件 onclick,onmouseou...

  • 开发小记

    开发小记 禁止页面滚动 js jquery 监听input的输入事件 绑定input事件的时候我发现...

  • vue监听滚动事件切换列表和监听onresize事件

    vue监听鼠标滚动事件 vue监听onresize事件 需求:(1)页面部分元素的尺寸需要根据实际打开时浏览器尺寸...

  • 悬浮按钮滚动时隐藏不滚动显示

    小程序里添加滚动并监听滚动事件 wxml 代码 wxss 代码 js 代码 web页面实现方法 html代码 cs...

网友评论

      本文标题:js 监听浏览器不滚动事件

      本文链接:https://www.haomeiwen.com/subject/ieeknqtx.html