V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
s609926202
V2EX  ›  问与答

找一个可以监测页面滚动结果的 js 插件,,,???

  •  
  •   s609926202 · 2018-03-07 10:47:44 +08:00 · 1248 次点击
    这是一个创建于 2458 天前的主题,其中的信息可能已经有所发展或是发生改变。

    比如页面向上滚动,,向下滚动,,滚动到顶部,滚动到底部,,这样子的监测 js 插件,,求推荐,。

    7 条回复    2018-03-07 15:13:12 +08:00
    DT27
        1
    DT27  
       2018-03-07 10:53:18 +08:00
    hanzichi
        2
    hanzichi  
       2018-03-07 11:45:29 +08:00
    自己写个呗,就几行代码
    s609926202
        3
    s609926202  
    OP
       2018-03-07 11:47:32 +08:00
    @hanzichi
    // 页面滚动监测
    var bodyScrollTop = 0,
    bodyScrollBefore = 0;
    $(window).scroll(function () {
    bodyScrollTop = $(this).scrollTop();

    // 滚动时给 header 加标识
    $('.header').addClass('is-scrolled');

    if (bodyScrollTop >= bodyScrollBefore) { // 向下滚动
    console.log('向下滚动');
    $('.header').removeClass('is-retracted');
    } else { // 向上滚动
    console.log('向上滚动');
    $('.header').addClass('is-retracted');
    }

    setTimeout(function () {
    bodyScrollBefore = bodyScrollTop;
    }, 50);
    });

    这是我写的,,但是不能很好的监测,,总是会有延迟。或者判断不准确。
    hanzichi
        4
    hanzichi  
       2018-03-07 14:17:51 +08:00
    @s609926202

    setTimeout(function () {
    bodyScrollBefore = bodyScrollTop;
    }, 50);
    });

    这干嘛。。
    luoway
        5
    luoway  
       2018-03-07 14:52:33 +08:00
    楼主需要的是解决性能问题了,查下函数节流、去抖
    s609926202
        6
    s609926202  
    OP
       2018-03-07 15:04:50 +08:00
    @hanzichi 这个是记录滚动前一时间点距离顶部的距离
    hanzichi
        7
    hanzichi  
       2018-03-07 15:13:12 +08:00
    @s609926202 及时记录啊,你这延迟 50ms 记录,当然感觉有延迟了。。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1039 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 20:52 · PVG 04:52 · LAX 12:52 · JFK 15:52
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.