js判断是否下拉刷新
if(document.body.scrollTop + window.innerHeight>=document.body.clientHeight-10){
this.loadPointsList();
}
//下面这个是用jquery
if($(document).scrollTop() + $(window).height() > $(document).height() - 10) {
this.loadPointsList();
}
document.body.scrollTop用法如下:
网页可见区域宽: document.body.clientWidth;
网页可见区域高: document.body.clientHeight;
网页可见区域宽: document.body.offsetWidth (包括边线的宽);
网页可见区域高: document.body.offsetHeight (包括边线的宽);
网页正文全文宽: document.body.scrollWidth;
网页正文全文高: document.body.scrollHeight;
网页被卷去的高: document.body.scrollTop;
网页被卷去的左: document.body.scrollLeft;
网页正文部分上: window.screenTop;
网页正文部分左: window.screenLeft;
屏幕分辨率的高: window.screen.height;
屏幕分辨率的宽: window.screen.width;
屏幕可用工作区高度: window.screen.availHeight;
屏幕可用工作区宽度:window.screen.availWidth;
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX 相对文档的水平座标
event.clientY 相对文档的垂直座标
event.offsetX 相对容器的水平坐标
event.offsetY 相对容器的垂直坐标
document.documentElement.scrollTop 垂直方向滚动的值
event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量
要获取当前页面的滚动条纵坐标位置,用:
document.documentElement.scrollTop;
而不是:
document.body.scrollTop;
documentElement 对应的是 html 标签,而 body 对应的是 body 标签
js判断是否下拉刷新的更多相关文章
- H5页面基于iScroll.js插件实现下拉刷新,上拉加载更多
前言 在我之前的项目中,页面总是干巴巴的,用户的体验不是特别完美,我也是一直觉得把设计师给到的psd做出来就好,很少考虑用户的感受.我喜欢看不同的App,操作每个步骤,观赏每个能和我互动的交互设计效果 ...
- 使用dropload.js插件进行下拉刷新
移动端的下拉刷新是一个比较常见的功能了,网上也有很多框架,插件都有这种功能,所以直接拿来用就好了. html代码: <!--选项卡--><div class="tab&qu ...
- js 前端实现下拉刷新 上拉加载
效果 css html,body{ height:100%; // 其他界面未设置html 无法监听scroll } /* 下拉刷新 */ .refresh-loading { transition: ...
- Ionic Js三:下拉刷新
在加载新数据的时候,我们需要实现下拉刷新效果,代码如下: HTML 代码 <body ng-app="starter" ng-controller="actions ...
- mui下拉刷新上拉加载
新外卖商家端主页订单大厅页面 使用mui双webview,实现下拉刷新上拉加载 主页面: order_index.html <!doctype html> <html> < ...
- JS+CSS实现的下拉刷新/上拉加载插件
闲来无事,写了一个当下比较常见的下拉刷新/上拉加载的jquery插件,代码记录在这里,有兴趣将代码写成插件与npm包可以留言. 体验地址:http://owenliang.github.io/pull ...
- vue.js移动端app实战4:上拉加载以及下拉刷新
上拉加载以及下拉刷新都是移动端很常见的功能,在搜索或者一些分类列表页面常常会用到. 跟横向滚动一样,我们还是采用better-scroll这个库来实现.由于better已经更新了新的版本,之前是0.几 ...
- 【学习笔记】js下拉刷新、上拉加载 mescroll框架的使用
写在前边: 工作需要,使用ajax在原来的列表下边使用ajax请求后台数据,拼接在列表最下边,在github转了好久,发现了一个bug极多的js刷新插件,尝试了一个下午,就在快放弃的时候,发现下边有留 ...
- js上拉加载下拉刷新
写在前边: 工作需要,使用ajax在原来的列表下边使用ajax请求后台数据,拼接在列表最下边,在github转了好久,发现了一个bug极多的js刷新插件,尝试了一个下午,就在快放弃的时候,发现下边有留 ...
随机推荐
- Java编写的接口测试工具
这几天由于要频繁地使用一些天气数据接口,但是每次都要频繁的打开网页,略显繁琐,故就自己做了两个json数据获取的小工具. 第一个 先来看看第一个吧,思路是使用一个网络流的处理,将返回的json字符串数 ...
- hadoop集群崩溃,因为tmp下/tmp/hadoop-hadoop/dfs/name文件误删除
hadoop执行start-all后,显示正常启动. starting namenode, logging to /opt/hadoop-0.20.2-cdh3u0/logs/hadoop-hadoo ...
- android:layout_alignleft layout_toleftof区别,详解RelativeLayout布局属性
转载请注明博客地址. 最近看博客看到有关于RelativeLayout布局的解释,有的解释很多是错误的.因此有必要对每一个常见的布局属性进行描述.以下解释全部都是逐行进行测试的. 首先把常用的布局分组 ...
- Swift基础之Delegate方法的使用
本文简单介绍了使用Delegate方法的进行值的传递,改变上一个界面的字体大小和颜色 首先创建一个导航视图: let viewC = ViewController(); let navi ...
- android:background="@color/white" [create file color.xml at res/values/]
<resources><color name="white">#FFFFFF</color><!--白色 --><col ...
- Leetcode_13_Roman to Integer
本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/41486885 通过本文你可能学到的知识如下: (1)理解本 ...
- iOS开发 runtime实现原理以及实际开发中的应用
自己写了一个小例子:有一些相关知识点和博客文章 A: 首先现在控制器里面初始化一个对象,然后调用对象的方法: #import "ViewController.h" #import ...
- AngularJS进阶(三十一)AngularJS项目开发技巧之获取模态对话框中的组件ID
AngularJS项目开发技巧之获取模态对话框中的组件ID 需求 出于项目开发需求,需要实现的业务逻辑是:药店端点击查看"已发货""已收货"订单详情时,模块弹出 ...
- Leetcode_100_Same Tree
本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/42061529 Given two binary trees ...
- iOS开发:创建真机调试证书步骤(还有一篇是真机测试步骤)(2015年)
(关于真机测试步骤的blog:http://blog.csdn.net/hbblzjy/article/details/51680282) 1.首先打开苹果的开发者网站(https://develop ...