html结构

<div class="page">
<!-- Page content should have additional "pull-to-refresh-content" class -->
<div class="page-content pull-to-refresh-content" data-ptr-distance="55">
<!-- Default pull to refresh layer-->
<div class="pull-to-refresh-layer">
<div class="preloader"></div>
<div class="pull-to-refresh-arrow"></div>
</div> <!-- usual content below -->
<div class="list-block">
...
</div>
</div>
</div>

js调用

var myApp = new Framework7();

var $$ = Dom7;
// Pull to refresh content
var ptrContent = $$('.pull-to-refresh-content'); // Add 'refresh' listener on it
ptrContent.on('refresh', function (e) {
// Emulate 2s loading
setTimeout(function () {
//刷新操作// When loading done, we need to reset it
myApp.pullToRefreshDone();
}, 2000);
});

Framework7 下拉刷新的更多相关文章

  1. framework7 下拉刷新、无限滚动

    下拉刷新: html: <div class="page-content ptr-content"> <%--下拉刷新图标--%> <div clas ...

  2. Android SwipeRefreshLayout 下拉刷新——Hi_博客 Android App 开发笔记

    以前写下拉刷新 感觉好费劲,要判断ListView是否滚到顶部,还要加载头布局,还要控制 头布局的状态,等等一大堆.感觉麻烦死了.今天学习了SwipeRefreshLayout 的用法,来分享一下,有 ...

  3. 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载

    title: 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载 tags: -RecyclerView,下拉刷新,上拉加载更多 grammar_cjkRuby: true - ...

  4. listview下拉刷新和上拉加载更多的多种实现方案

    listview经常结合下来刷新和上拉加载更多使用,本文总结了三种常用到的方案分别作出说明. 方案一:添加头布局和脚布局        android系统为listview提供了addfootview ...

  5. Xamarin. Android实现下拉刷新功能

    PS:发现文章被其他网站或者博客抓取后发表为原创了,给图片加了个水印 下拉刷新功能在安卓和iOS中非常常见,一般实现这样的功能都是直接使用第三方的库,网上能找到很多这样的开源库.然而在Xamarin. ...

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

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

  7. android官方下拉刷新控件SwipeRefreshLayout的使用

    可能开发安卓的人大多数都用过很多下拉刷新的开源组件,但是今天用了官方v4支持包的SwipeRefreshLayout觉得效果也蛮不错的,特拿出来分享. 简介:SwipeRefreshLayout组件只 ...

  8. 分页插件思想:pc加载更多功能和移动端下拉刷新加载数据

    感觉一个人玩lol也没意思了,玩会手机,看到这个下拉刷新功能就写了这个demo! 这个demo写的比较随意,咱不能当做插件使用,基本思想是没问题的,要用就自己封装吧! 直接上代码分析下吧! 布局: & ...

  9. 完美解决,浏览器下拉显示网址问题 | 完美解决,使用原生 scroll 写下拉刷新

    在 web 开发过程中我们经常遇到,不想让用户下拉看到我的地址,也有时候在 div 中没有惯性滚动,就此也出了 iScroll 这种关于滚动条的框架,但是就为了一个体验去使用一个框架好像又不值得,今天 ...

随机推荐

  1. ArcGIS Server 10.1安装、配置、发布地图服务

    先跟大家分享一个esri的学习资料,http://pan.baidu.com/s/1nBzxB,<ArcGIS10.1 for Server 入门教程>.教程讲述的很清楚,下面说说我这次发 ...

  2. MyBatis配置文件(二)--settings配置

    settings是MyBatis中最复杂的配置,它能影响MyBatis底层的运行,大部分情况下使用默认值,只需要修改一些常用的规则即可.常用规则有自动映射.驼峰命名映射.级联规则.是否启动缓存.执行器 ...

  3. 前端存取cookie

    1.存cookie document.cookie="user_phone="+loginMake1Value;//存手机号码cookie//'user_phone'为cookie ...

  4. PAT甲级——A1027 Colors in Mars

    People in Mars represent the colors in their computers in a similar way as the Earth people. That is ...

  5. jQuery同步/异步调用后台方法

    $.ajax({ type: "Post", url: "UserManage.aspx/SubmitPage",//页面/方法名 data: "{' ...

  6. HDFS的Web界面

  7. Linux时间设置命令

    1.date: 语法格式:date [-u] [-d datestr] [-s datestr] [--utc] [--universal] [--date=datestr] [--set=dates ...

  8. numpy库数组属性查看:类型、尺寸、形状、维度

    import numpy as np   q = np.array([1,2,3,4],dtype=np.complex128)    print("数据类型",type(q))  ...

  9. LeetCode412Fizz Buzz

    写一个程序,输出从 1 到 n 数字的字符串表示. 1. 如果 n 是3的倍数,输出"Fizz": 2. 如果 n 是5的倍数,输出"Buzz": 3.如果 n ...

  10. .NET2.0引用.NET3.5的System.Core.dll&Dapper在.NET2.0下的配置

    微软MSDN对.NET2.0,3.0,3.5的描述: .NET Framework 版本 2.0.3.0 和 3.5 是使用同一 CLR 版本 (CLR 2.0) 生成的. 这些版本表示单个安装的连续 ...