直接复制粘贴 放在页面中即可

<script>
window.onload = function(){
window.addEventListener('touchstart', touchstart, false);
window.addEventListener('touchmove', touchMove, false);
}

var _start = 0;
var _end = 0;
function touchstart(event) {
var touch = event.targetTouches[0];
_start = touch.pageY;
}
function touchMove(event){
var touch = event.targetTouches[0];
_end = ( touch.pageY - _start);
//下滑才执行操作
if(_end > 200){     //200即手机下滑屏幕的距离,超过200则执行刷新动作
location.reload();
}
}
</script>

移动web前端下拉刷新效果的更多相关文章

  1. 移动端上拉加载,下拉刷新效果Demo

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. [Swift通天遁地]二、表格表单-(4)使用系统自带的下拉刷新控件,制作表格的下拉刷新效果

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  3. [Swift通天遁地]二、表格表单-(6)创建美观的表格弹性下拉刷新效果

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  4. 关于h5手机端上拉加载和下拉刷新效果-1

    1.手机端目前很火的效果,上拉加载,和下拉刷新.目前主要使用 iscroll 框架来实现.先推荐一个iscroll中文学习的网站,不要感谢,我是雷锋. 2.https://iiunknown.gitb ...

  5. 手机端轻应用模拟原生的下拉刷新效果(JavaScript)

    方案一:使用iscoll等有下拉功能的框架. 分析:因为项目的结构已经基本完成,再使用框架,会与原来的结构互相影响: 方案二:用JavaScript.Jquery写. 分析:可能没有直接使用框架的效果 ...

  6. Swift 自定义炫酷下拉刷新效果

    先来看下效果 下拉刷新 其实下拉刷新没大家想得那么难.本文已第二个为例子.给大家讲解下下拉刷新的做法(完整代码后面会放上) 首先,先搞一个single View Application .然后进Mai ...

  7. 代码实现Android5.0的下拉刷新效果

    如图所示,实现类似与gmail的下拉刷新. 项目地址:https://github.com/stormzhang/SwipeRefreshLayoutDemo 一.在xml文件中定义 这个控件在sup ...

  8. android使用PullToRefresh实现上拉加载和下拉刷新效果

    其实很早前就在博客园中也写过官方的下拉刷新控件SwipeRefreshLayout,但是这个控件仅仅支持下拉刷新,用起来还算可以.然而在我们实际开发应用中,很多地方都不止有下拉刷新,而且还有上拉加载的 ...

  9. Android下拉刷新效果实现

    本文主要包括以下内容 自定义实现pulltorefreshView 使用google官方SwipeRefreshLayout 下拉刷新大致原理 判断当前是否在最上面而且是向下滑的,如果是的话,则加载数 ...

随机推荐

  1. jdbc链接数据库的三种方式

    /** * jdbc连接数据库 * @author APPle * */ public class Demo1 { //连接数据库的URL private String url = "jdb ...

  2. bug 汇总

    联通营业厅充话费无法在线支付,chrome Python 64位安装包 win7 64 windows 10 右键菜单 Android studio IE11 layout

  3. NXP NFC移植及学习笔记(原创)

    NFC功能介绍 NFC 目前使用的三种功能: 1. P2P模式:基于LLCP协议的基础上,以NDEF数据交换格式来通信. 2. 读写模式:当作为读卡器,对NFC Tag的读写. 3. 卡模拟模式:模块 ...

  4. MFC---给按钮加上快捷键

    现在快捷键的使用已经很频繁了.快捷键可以使我们的操作变得更简单,更快捷.如何给自己的按钮加一个快捷键呢.    如下图:我们希望给我们的参照按钮加一个快捷键CTR + F. 不要以为在按钮的标题上加上 ...

  5. Oracle Database 12c Release 1下载安装(自身经历)

    1.访问Oracle官网:https://www.oracle.com/index.html,下载Oracle Database 12c Release 1 (注意:File1和File2都要下载!! ...

  6. hadoop2.6.4 搭建伪分布式

    安装jdk1.7 http://www.cnblogs.com/zhangXingSheng/p/6228432.html  ------------------------------------- ...

  7. Android 自定义ToolBar详细使用

    自定义xml设置ToolBar,通过menu文件扩展选项,通过继承baseactivity使用 1.ToolBar布局 <?xml version="1.0" encodin ...

  8. CRC循环冗余校验码总结(转)

    转自 http://blog.csdn.net/u012993936/article/details/45337069 一.CRC简介 先在此说明下什么是CRC:循环冗余码校验 英文名称为Cyclic ...

  9. ZooKeeper基本原理

    ZooKeeper简介 ZooKeeper是一个开放源码的分布式应用程序协调服务,它包含一个简单的原语集,分布式应用程序可以基于它实现同步服务,配置维护和命名服务等. ZooKeeper设计目的 1. ...

  10. C++预定义宏

    C/C++宏体中出现的#,#@,##: - #的功能是将其后面的宏参数进行字符串化操作(stringfication),就是对它所引用的宏变量通过替换后在其左右各加上一个双引号 -##被称为连接符(c ...