原生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 ...
随机推荐
- C++泛化双向链表
泛型双向链表 双向链表(doublyLinkedList.h) /******************************************************************* ...
- .netCore下的jwt的梳理-->借鉴于“老张的哲学”
之前在公司的项目中有用到jwt进行token验证,但是公司里用的框架已经集成好了jwt,所以对jwt的的了解不够清晰,感觉还是隔着一层.在看了“老张的哲学”的jwt部分后对jwt的认识才更加深刻了一些 ...
- 编写程序实现根据考试成绩将成绩分为A,B,C,D四档。
score = float(input("请输入你的成绩:"))if 90 <= score <= 100: print("你的成绩为A档")eli ...
- Markdown怎么使用制表符TAB键?为什么TAB失灵了?
目录 问题描述 解决办法 问题描述 我们写文章(Markdown文章)的时候,经常想使用自然段标记划分段落,可是我们会发现,不管是任何编辑器,tab键都没有用,怎么办? 解决办法 语法: 文章- ...
- js函数的三种成创建方式以及它们各自的不同
js有三种创建函数的方式: 1.function语句(也叫函数声明) function sum(a, b) { return a + b; } sum(1, 2); // 3 2. 函数直接量,又叫函 ...
- 使用 notepad 正则转换 字符串
一..在一堆字符串中找出某一个特定格式的字符串,例如如下 需要摘出 WMID_abc WMID_def WMID_ghi {"abc",WMID_abc,oid_abc} {&qu ...
- iframe 框架父页面刷新子页面
1.父页面添加: <script> function testBtn(){ var reshSrc = document.getElementById('myFrame').src; ...
- 大数据软件安装之Azkaban(任务调度)
一.安装部署 1.安装前准备 1)下载地址:http://azkaban.github.io/downloads.html 2)将Azkaban Web服务器.Azkaban执行服务器.Azkaban ...
- RMQ Tarjan的Sparse-Table算法
参考博客:https://www.cnblogs.com/wenzhixin/p/9714760.html 预处理时间复杂度是O(nlogn),代码如下: void init(const vector ...
- abp(net core)+easyui+efcore实现仓储管理系统——入库管理之六(四十二)
abp(net core)+easyui+efcore实现仓储管理系统目录 abp(net core)+easyui+efcore实现仓储管理系统——ABP总体介绍(一) abp(net core)+ ...