检测滚动方向

2024-03-28

所以我尝试使用 JavaScripton scroll调用函数。但我想知道是否可以在不使用 jQuery 的情况下检测滚动的方向。如果没有那么有什么解决方法吗?

我本来想只放一个“到顶部”按钮,但如果可以的话我想避免这种情况。

我现在刚刚尝试使用此代码,但它不起作用:

if document.body.scrollTop <= 0 {
    alert ("scrolling down")
} else {
    alert ("scrolling up")
}

可以通过存储之前的信息来检测scrollTopvalue 并将当前的scrollTop值与它进行比较。

JavaScript:

var lastScrollTop = 0;

// element should be replaced with the actual target element on which you have applied scroll, use window in case of no target element.
element.addEventListener("scroll", function(){ // or window.addEventListener("scroll"....
   var st = window.pageYOffset || document.documentElement.scrollTop; // Credits: "https://github.com/qeremy/so/blob/master/so.dom.js#L426"
   if (st > lastScrollTop) {
      // downscroll code
   } else if (st < lastScrollTop) {
      // upscroll code
   } // else was horizontal scroll
   lastScrollTop = st <= 0 ? 0 : st; // For Mobile or negative scrolling
}, false);
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

检测滚动方向 的相关文章

随机推荐

  • 无法将 .war 应用程序部署到 GlassFish 3.1.2

    我有一个 war 应用程序模块 无需任何异常更改和服务器调整即可成功部署 但是 我无法将此应用程序部署到 GF 3 1 2 服务器抛出以下异常 java lang Exception java lang IllegalStateExcept
  • 小数的小数次方?

    net 框架在 Math 类中提供了一种对 double 进行幂运算的方法 但根据精度要求 我需要将小数提高到小数次方 Pow decimal a decimal b 框架有这样的功能吗 有谁知道有这种功能的库吗 为了解决我的问题我找到了一
  • 使用 aws cli 获取 S3 存储桶的 ARN

    是否可以通过AWS命令行获取S3存储桶的ARN 我已经查看了文档aws s3api and aws s3 并且还没有找到一种方法来做到这一点 总是如此arn PARTITION s3 NAME OF YOUR BUCKET 如果您知道存储桶
  • 在方便的初始值设定项中使用 self = 来委托给 JSONDecoder 或 Swift 中的工厂方法,以避免“无法分配给值:'self' 是不可变的”

    有时在 Swift 中 为委托的类编写一个初始化程序可能会很方便JSONDecoder或工厂方法 例如 有人可能想写 final class Test Codable let foo Int init foo Int self foo fo
  • 备份使用git的项目

    在快速重新安装之前 我正在将我的东西刻录到 DVD 上 作为最近的用户 从来没有用 git 这样做过 所以我只是和你们核实一下 如果我理解正确的话 我只需要备份我的项目目录project name 其中有 git在它里面 一起监视隐藏文件
  • 在 Karma 运行所有测试之前执行角度代码?

    是否可以在 karma 中执行某种初始化编码 在执行测试之前 我需要运行这样的代码 angular module module common brand constant BRAND brandname 我的应用程序当前需要这个模块 和这个
  • 批量发送API调用

    我目前正在尝试模拟 50 万个 IoT 设备 以使用 Nodejs 将有效负载推送到 Azure IoT 中心 由于节点本质上是多线程的 因此它的物联网中心充满了数据 并且我收到了网络错误 我还尝试了异步 等待方法 但这需要花费大量时间将数
  • 使用 SciPy 拟合贝塞尔曲线

    我有一组近似二维曲线的点 我想使用 Python 与 numpy 和 scipy 来查找近似拟合点的三次贝塞尔路径 其中我指定两个端点的精确坐标 并返回其他两个控制点的坐标 我最初以为scipy interpolate splprep 可能
  • PHP - 小时差(HH:MM 格式)

    我正在尝试计算在这里工作的人的轮班模式 从结束时间中减去开始时间在很大程度上是可行的 但如果他们通宵工作则不行 例如某人工作于10pm to 6am将显示为 22 00 06 00 我希望它能回来8 hours 但我就是想不出最好的方法 令
  • 谷歌图表趋势线未显示

    我有一个 Google 图表折线图 我想在其上显示趋势线 但它没有显示 数据是从数据库中获取的 而 JavaScript 是由 PHP 生成的 但生成的 JavaScript 如下所示
  • LINQ 查询中的分组依据

    我有一个 DataTable 我想在其中执行 GroupBy 查询 year url type id someurl image 0 2003 date 0 someurl image 1 2009 date 1 我已成功对我的 ID 进行
  • WPF 动画“无法冻结此情节提要时间线树以供跨线程使用”

    我当前有一个列表框 其所选项目绑定到我的 ViewModel 上的属性 每当所选项目不为空时 我想对其执行动画 但是我不断收到以下错误 无法冻结此情节提要时间线树以供跨线程使用 并通过研究了解为什么会发生这种情况 但是我不确定需要采取什么方
  • 如何分组并获取具有 X max 的 Y 列的值? [复制]

    这个问题在这里已经有答案了 我有一个以前从未遇到过的用例 我有以下数据框 并且想要选择 y 的值 其中 x 分别为条件 i 的每个级别实现其最小值和最大值 gt library dplyr gt df lt data frame i c 1
  • 在 ubuntu 20.04 上运行 Tensorflow 时出现“无法加载动态库 'libcudnn.so.8'”

    注意 有很多类似的问题 但是针对不同版本的 ubuntu 和有些不同的特定库 我一直无法弄清楚符号链接 其他环境变量的组合 例如LD LIBRARY PATH会工作 这是我的nvidia配置 nvidia smi Tue Apr 6 11
  • 相当于 dash shell 中的 pipelinefail

    有没有类似的选项dash外壳对应于pipefail in bash 或者如果管道中的命令之一失败 但不退出 则获得非零状态的任何其他方式 set e would 为了更清楚地说明这一点 这是我想要实现的目标的示例 在示例调试 makefil
  • 在 Slack 中合并消息菜单和消息按钮

    我想在我的 Slack 应用程序中结合消息菜单和消息按钮 这是我想要实现的工作流程 1 用户发出斜杠命令来显示菜单 该菜单将有一个下拉菜单和三个按钮 这是我能够实现的 2 我希望用户从下拉列表中选择一个选项 然后按任何操作按钮 然后只应触发
  • Warshall算法思想及改进[关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 Warshall Floyd 算法 https en wikipedia org wiki Floyd E2 80 93Warshall a
  • 基于点的线/平面相交

    我在空间中有两个点 L1 和 L2 它们定义了一条线上的两个点 我在空间中有三个点 P1 P2 和 P3 这三个点在平面上 那么给定这些输入 直线在什么点与平面相交 外汇 平面方程 A x B y C z D 0 为 A p1 Y p2 Z
  • 我可以让一个标识字段跨越 SQL Server 中的多个表吗?

    我可以有一个跨多个表的 身份 唯一的 非重复的 列吗 例如 假设我有两个表 书籍和作者 Authors AuthorID AuthorName Books BookID BookTitle BookID 列和AuthorID 列是标识列 我
  • 检测滚动方向

    所以我尝试使用 JavaScripton scroll调用函数 但我想知道是否可以在不使用 jQuery 的情况下检测滚动的方向 如果没有那么有什么解决方法吗 我本来想只放一个 到顶部 按钮 但如果可以的话我想避免这种情况 我现在刚刚尝试使