程序员经验分享-hwhale

JS和JQuery监听滚动条事件

2023-05-16

网上查了一下，找到两种js监听滚轮事件的方法

（1）window.onscroll = function() {} 

（2）document.addEventListener("onscroll", function (e) {})

js例子：

<a id="scrollup" href="#top" style="position:fixed;z-index: 999;display: none;">^</a>
#scrollup{
        background: #777;
        color:#eee;
        font-size: 40px;
        text-align: center;
        text-decoration: none;
        bottom:65px;
        right:20px;
        overflow: hidden;
        width:46px;
        height:46px;
        border:none;
        opacity:.8;
        &:active{opacity:.7;}
    }
<script type="text/javascript">
         window.onscroll= function(){
                //变量t是滚动条滚动时，距离顶部的距离
                var t = document.documentElement.scrollTop||document.body.scrollTop;
                var scrollup = document.getElementById('scrollup');
                //当滚动到距离顶部200px时，返回顶部的锚点显示
                if(t>=200){
                    scrollup.style.display="block";
                }else{          //恢复正常
                    scrollup.style.display="none";
                }
            }
</script>

写成jquery的话就是比如这样：

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

JS和JQuery监听滚动条事件 的相关文章

随机推荐

  • K210+MLX90614红外测温

    红外测温 文章目录 红外测温前言一 MLX90614二 使用步骤总结 前言 K210随便找一个都行 一 MLX90614 这个模块之前的博客有介绍 xff0c 他是用IIC通信的 模块就不过多介绍了 xff0c 之间看代码吧 import

  • PHP mysql_connect()连接-已淘汰

    1 首先在mysql命令控制台新建数据库 mysql gt create database test Query OK 1 row affected 0 04 sec mysql gt use test Database changed m

  • STM32使用红外测温

    红外测温 文章目录 红外测温前言一 原理二 STM32代码1 MLX90614 c2 MLX90614 h 总结 前言 一 原理 红外测温的原理可以直接去看卖家的手册 xff0c 手册多余的话太多了 xff0c 知道他是IIC通信的就行了

  • Arduino——PAJ7620手势识别模块

    手势识别模块 文章目录 手势识别模块前言一 安装PAJ7620库二 代码 前言 在用arduino驱动这些模块得时候 xff0c 方法很简单 xff0c 先去管理库中找这个库 xff0c 如果有这个库 xff0c 然后下载这个库 xff0c

  • Arduino——正点原子sim800c模块

    sim800c 文章目录 sim800c前言一 arduino代码 前言 最近要做一个项目需要用到sim800c xff0c 就用arduino驱动一下吧 xff0c 用的是正点原子的sim800c 使用的时候最好使用12v1A供电 xff

  • Arduino——野火GPS模块

    GPS模块 文章目录 GPS模块前言一 Arduino代码 前言 手上还有一个GPS xff0c 用arduino做模块很方便 xff0c 打算和短信模块结合 xff0c 短信模块上次已经使用完成了 xff0c 这次学习一下GPS模块 看模

  • Arduino——GY39大气压、温湿度、光照模块

    GY39模块 文章目录 GY39模块前言一 模块介绍二 arduino代码 前言 前几天买东西的时候买了一个GY39 xff0c 这个模块集成了温湿度 xff0c 大气压 xff0c 海拔 xff0c 光照一体 xff0c 使用起来很方面

  • Arduino通过NRF24L01实现双机无线通信

    双机无线通信 文章目录 双机无线通信前言一 接线二 Arduino代码1 主机2 从机 总结 前言 无线通信对于做各种项目来说都很加分 xff0c 今天使用这个nrf模块进行无线通信 我原本是想用两个蓝牙的 xff0c 但是蓝牙有个缺点 x

  • STM32+ESP8266+机智云+DHT11数据上传

    机智云 文章目录 机智云前言一 工程的修改二 数据的上传1 标识符2 数据处理3 数据上传 三 app控制 前言 今天搞了一下机智云 xff0c 就想把温湿度发到app上去 xff0c 然后能够控制灯的开关 之前从来没有用过这个玩意 xff

  • 数据结构——线性结构（二）

    数据结构 文章目录 数据结构前言一 线性结构1 线性表2 线性表的特点 二 线性结构的存储形式1 顺序结构2 链式结构 前言 很早之前提到了数据结构 xff0c 上一篇博客简单介绍了什么是线性结构 xff0c 这篇博客简单做一个补充 常见的

  • 数据结构——顺序表（三）

    数据结构 文章目录 数据结构一 什么是顺序表二 顺序表的创建1 静态顺序表2 动态数据表 三 顺序表的初始化 销毁四 顺序表的插入1 尾插2 头插3 任意插入 总结 一 什么是顺序表 顺序表是用一段物理地址连续的存储单元依次存储数据元素的线

  • PHP new mysqli()连接

    1 首先在mysql命令控制台新建数据库 mysql gt create database test Query OK 1 row affected 0 04 sec mysql gt use test Database changed m

  • 数据结构——链表（五）

    数据结构 96 文章目录 数据结构前言一 什么是链表二 实现单链表1 单链表的结构2 单链表的初始化3 单链表的插入4 遍历链表5 链表长度 总结 前言 接下来学习一下链表 xff0c 链表比数组用的更多 一 什么是链表 概念 xff1a

  • 数据结构——双向循环链表（八）

    数据结构 文章目录 数据结构前言一 双向循环链表初始化二 双向循环链表的插入遍历 三 双向链表的删除总结 前言 双向循环链表用的次数是最多的 xff0c 下面我们看一下双向循环链表的增删改查 一 双向循环链表初始化 双向循环链表不能出现NU

  • 数据结构——栈（九）

    数据结构 文章目录 数据结构前言一 栈的介绍二 栈的实现1 栈的结构2 栈的初始化3 进栈4 出栈5 栈的判断6 取栈顶元素7 栈的清空8 栈的销毁 总结 前言 栈是一种特殊的线性表 xff0c 只允许在固定的一端进行插入和删除元素的操作

  • 数据结构——队列（十）

    数据结构 文章目录 数据结构一 什么是队列二 队列的实现1 队列的结构2 队列的初始化3 入队4 出队6 队头队尾的获取 总结 一 什么是队列 队列 xff1a 只允许在一端进行插入数据操作 xff0c 在另一端进行删除数据操作的特殊线性表

  • ESP8266通过MQTT协议连接onenet云平台

    中国移动onenet平台 文章目录 中国移动onenet平台前言一 onenet平台二 ESP82661 完整代码2 联网代码3 连云代码4 数据处理 总结 前言 最近在弄onenet平台 xff0c 用arduino结合esp8266 x

  • Arduino串口提取数字（整型和浮点型）

    数据提取 文章目录 数据提取前言一 提取整型数据二 提取浮点型数据 前言 之前需要用32和ESP进行通信上传数据 xff0c 一直都用的都是数据上传然后处理成整型数据 xff0c 今天需要处理成浮点型数据所以就查了一下 xff0c 于是就记

  • vins-fusion环境配置、安装与测试

    本文主要介绍如何搭建vins fusion的运行环境 xff0c 以及解决vins fusion编译运行时遇到的环境冲突问题 xff0c 并在此基础上实现例程的运行 目录 一 安装OpenCV 3 4 111 1 配置依赖环境1 2 下载O

  • JS和JQuery监听滚动条事件

    网上查了一下 xff0c 找到两种js监听滚轮事件的方法 xff08 1 xff09 window onscroll 61 function xff08 2 xff09 document addEventListener 34 onscro

热门标签