js 判断滚动条是否停止滚动
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js判断滚动条停止</title>
<style type="text/css">
.box {
height: 3000px;
}
</style>
<script type="text/javascript">
var topValue = 0, // 上次滚动条到顶部的距离
interval = null; // 定时器
document.onscroll = function() {
if(interval == null) {
// 未发起时,启动定时器,1秒1执行
interval = setInterval(function() {
if(document.documentElement.scrollTop == topValue) {
alert("scroll bar is stopping!");
clearInterval(interval);
interval = null;
}
}, 1000);
}
topValue = document.documentElement.scrollTop;
}
</script>
</head>
<div class="box"></div>
<body>
</body>
</html>
这个需求是我在写一个固钉的时候遇到的问题,当滚动条滚动时固钉隐藏,当停止滚动时固钉出现
js 判断滚动条是否停止滚动的更多相关文章
- JS判断滚动条是否停止滚动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js判断滚动条是否已到页面最底部或顶部实例
原文 本文实例讲述了js判断滚动条是否已到页面最底部或顶部的方法.分享给大家供大家参考.具体分析如下: 我们经常会看到很多的网站一个返回顶部效果就是当我们滚动条到指定位置时返回顶部出来了,否则就自动隐 ...
- js判断用户是否正在滚动滚动条,滚动条滚动是否停止
js智能判断是否可以自动滚动 比如,做一个音乐播放器,边播放,边定位歌词,播放的时候,需要自动定位到播放语句,但是用户去拖动或者滚动div(歌词面板)时,这时就必须停止自动滚动,或者说是不能自动滚动, ...
- 原生js判断手机端页面滚动停止
var topValue = 0,// 上次滚动条到顶部的距离 interval = null;// 定时器 contactsList = document.getElementById(" ...
- js判断滚动条到底部
判断滚动条到底部,需要用到DOM的三个属性值,即scrollTop.clientHeight.scrollHeight. scrollTop为滚动条在Y轴上的滚动距离. clientHeight为内容 ...
- IE,火狐,谷歌浏览器下js判断滚动条是否已拉到页面最底部
E/FF/Chrome下document.documentElement和document.body的 scrollHeight/scrollTop/clientHeight 以及判断滚动条是否已拉到 ...
- js判断鼠标是否停止移动
本程序实现当鼠标在一个特定的div内悬停n秒时,判断出已经停止移动. 思路: 1.定义全局变量鼠标移动状态imouse,定时器timer.当鼠标在div内移动时,imouse值为1,相反静止时值为0: ...
- JS判断滚动条到底部,页面是否有滚动条
要判断页面滚动条是否到底,需要了解三个属性: scrollHeight:获取元素内容高度的度量,包括由于溢出导致的视图中不可见内容,说直白点,算上了滚动条不可见的那部分高度. clientHeight ...
- js 判断滚动条的滚动方向
以下代码实现判断页面的滚动条的滚动方向: var sign = 80;//定义默认的向上滚与向下滚的边界 window.onscroll = window.onresize = function(){ ...
随机推荐
- L302 如何避免秃头
Every guy wants to know how to prevent hair loss. Or, every guy wants to cling to the idea that it m ...
- 四、使用汇编编写LED裸机驱动
1. 确定硬件连接 打开OK6410底板电路图,找到LED,可以发现NLEDx为0时LED点亮. 找到LED的控制引脚,发现LED控制引脚通过连接器连到了核心板: 打开核心板电路图,找到对应的连接器中 ...
- 解决You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near 'order (order_name, customer)
在学习hibernate一对多映射关系时,根据视频学习的时候,例子是顾客和订单的问题,一个顾客有多个订单.按照视频中的敲代码出现了You have an error in your SQL synta ...
- 阻止ARP欺骗
利用Look N Stop防火墙,防止arp欺骗 阻止网络执法官控制 网络执法官是利用的ARp欺骗的来达到控制目的的. ARP协议用来解析IP与MAC的对应关系,所以用下列方法可以实现抗拒网络执法官的 ...
- day12作业答案
2.1 # lst=['asdgg','as','drtysr'] # lst2=[i.upper() for i in lst if len(i) >3 ] # print(lst2) # 2 ...
- PAT乙级 1016. 部分A+B (15)
题目传送:https://www.patest.cn/contests/pat-b-practise/1016 正整数A的“DA(为1位整数)部分”定义为由A中所有DA组成的新整数PA.例如:给定A ...
- Spring Boot 揭秘与实战(九) 应用监控篇 - 自定义监控端点
文章目录 1. 继承 AbstractEndpoint 抽象类 2. 创建端点配置类 3. 运行 4. 源代码 Spring Boot 提供的端点不能满足我们的业务需求时,我们可以自定义一个端点. 本 ...
- python logging 模块的应用
对一名开发者来说最糟糕的情况,莫过于要弄清楚一个不熟悉的应用为何不工作.有时候,你甚至不知道系统运行,是否跟原始设计一致. 在线运行的应用就是黑盒子,需要被跟踪监控.最简单也最重要的方式就是记录日志. ...
- 【转载】 pytorch之添加BN
原文地址: https://blog.csdn.net/weixin_40123108/article/details/83509838 ------------------------------- ...
- php在foreach中使用引用赋值&可能遇到的问题(转)
楼主在写项目的时候,由于初涉PHP的赋值引用操作,觉得这个功能非常强大,用时一时爽,没有深入了解过其中的原理,导致了一些当时觉得不可思议的BUG,废话不都说,我举个例子详细的描述一下这个问题. 代码: ...