原生js判断手机端页面滚动停止
var topValue = 0,// 上次滚动条到顶部的距离
interval = null;// 定时器
contactsList = document.getElementById("contactsList");
contactsList.onscroll = function() { //我项目中的contactsList滚动 if(interval == null) {// 未发起时,启动定时器,1秒1执行
interval = setInterval(function () {
test();
}, 1000);
}
topValue = contactsList.scrollTop; } function test() {
//当滚动停止时,两个计算的距离会相同,此时再执行相关操作
console.log(contactsList.scrollTop,topValue);
if(contactsList.scrollTop == topValue) {
console.log("ok");
clearInterval(interval);
interval = null;
}
}
使用手机端滚动后,执行相关事件;onscroll是在元素滚动轴滚动时触发的。
jq mobile的方法,可看下http://www.runoob.com/jquerymobile/jquerymobile-events-scroll.html。
网址上有非常详细的使用方法。
scrollstart 事件是在用户开始滚动页面时触发:
$(document).on("scrollstart",function(){
alert("开始滚动!");
});
scrollstop 事件是在用户停止滚动页面时触发:
$(document).on("scrollstop",function(){
alert("停止滚动!");
});
原生js判断手机端页面滚动停止的更多相关文章
- 70.JS---利用原生js做手机端网页自适应解决方案rem布局
利用原生js做手机端网页自适应解决方案rem布局 刚开始我用的是下面这段代码,然后js通过外部链接引入,最后每次用手机刷新网页的时候都会出现缩略图 function getRem(pwidth, pr ...
- js判断手机端操作系统(Andorid/IOS)
非常实用的js判断手机端操作系统(Andorid/IOS),并自动跳转相应下载界面 androidURL = "http://xxx/xxx.apk"; var browser = ...
- js判断手机端操作系统的两种方法
//判断手机端操作系统(Andorid/IOS),并自动跳转相应下载界面 androidURL ="http://xxx/xxx.apk"; var browser = { ver ...
- js判断手机端
if (window.location.toString().indexOf('pref=padindex') != -1) { } else { if (/AppleWebKit.*Mobile/i ...
- JS判断手机端是否安装某应用
方法一(网页上判断) if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) { var loadDateTime = new Date() ...
- js判断手机端操作系统(Andorid/IOS),并自动为链接添加相应下载地址
<script type="text/javascript"> $(document).ready(function(e) { var u = navigator.us ...
- js判断手机端Android手机还是iPhone手机
/*判断当前设备是平板.安卓.苹果设备*/ <script type="text/javascript"> function fBrowserRedirect(){ v ...
- js判断手机端(Android手机还是iPhone手机)
/** * [isMobile 判断平台] * @param test: 0:iPhone 1:Android */ function ismobile(test){ var u = navigato ...
- 【转载】 原生js判断某个元素是否滚动到底部
document.querySelector('.content').addEventListener('scroll',function () { //读取内容区域的真实高度(滚动条高) // co ...
随机推荐
- Java的三魂七魄 —— 高级多线程
目录 Java的三魂七魄 -- 高级多线程 一.多线程的创建 二.线程安全问题 三.线程通信问题 四.更多实例 1.用线程同步的方法解决单例模式的线程安全问题 2.银行存钱问题(线程安全问题) 3.生 ...
- python数据分析工具 | numpy
Python中没有提供数组功能,虽然列表可以完成基本的数组功能,但并不是真正的数组,而且在数据量较大时,使用列表的速度回非常慢.因此,Numpy提供了真正的数组功能,以及对数据进行快速处理的函数.Nu ...
- Yuchuan_Linux_C 编程之十 进程及进程控制
一.整体大纲 二.基础知识 1. 进程相关概念 1)程序和进程 程序,是指编译好的二进制文件,在磁盘上,不占用系统资源(cpu.内存.打开的文件.设备.锁....) 进程,是一个抽象的概念,与 ...
- C++ const用法,看这一篇就够了!
本文主要介绍const修饰符在C++中的主要用法,下面会从两个方面进行介绍:类定义中使用const.非类定义中使用const 1. 非类定义中使用const 非类定义中使用const是指:在除了类定义 ...
- 对javaweb项目中web.xml重用配置的理解(个人学习小结)
<!-- 所有的总结描述性与语言都在注释中 --><?xml version="1.0" encoding="UTF-8"?> < ...
- postgreSQL外键引用查询 查询外键被那些表占用
根据一个表名,查询所有外键引用它的表,以及那些外键的列名key_column_usage(系统列信息表),pg_constraint(系统所有约束表) SELECT x.table_name, x.c ...
- Design Patterns | 02 什么样的代码是好代码
目录 01 - 什么是好的代码? 02 - 评价代码的标准有哪些 2.1 可维护性(maintainability) 2.2 可读性(readability) 2.3 可扩展性(extensibili ...
- MySQL字符集不一致导致性能下降25%,你敢信?
故事是这样的: 我在对MySQL进行性能测试时,发现CPU使用率接近100%,其中80%us, 16%sys,3%wa,iostat发现磁盘iops2000以下,avgqu-sz不超过3,%util最 ...
- XiaoQi.Study项目(一)
项目地址:https://github.com/xiaoqiyaozou1/XiaoQi.Study 感谢:“老张的哲学”.“晓晨”.“杨旭”等大佬的知识分享 一.项目创建 vs 2019 创建 as ...
- Crypto++ 无法解析的外部符号 CryptoPP::AssignIntToInteger
预处理器定义中添加:CRYPTOPP_NO_ASSIGN_TO_INTEGER 方案出自:https://github.com/weidai11/cryptopp/issues/389