Framework7 下拉刷新
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 下拉刷新的更多相关文章
- framework7 下拉刷新、无限滚动
下拉刷新: html: <div class="page-content ptr-content"> <%--下拉刷新图标--%> <div clas ...
- Android SwipeRefreshLayout 下拉刷新——Hi_博客 Android App 开发笔记
以前写下拉刷新 感觉好费劲,要判断ListView是否滚到顶部,还要加载头布局,还要控制 头布局的状态,等等一大堆.感觉麻烦死了.今天学习了SwipeRefreshLayout 的用法,来分享一下,有 ...
- 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载
title: 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载 tags: -RecyclerView,下拉刷新,上拉加载更多 grammar_cjkRuby: true - ...
- listview下拉刷新和上拉加载更多的多种实现方案
listview经常结合下来刷新和上拉加载更多使用,本文总结了三种常用到的方案分别作出说明. 方案一:添加头布局和脚布局 android系统为listview提供了addfootview ...
- Xamarin. Android实现下拉刷新功能
PS:发现文章被其他网站或者博客抓取后发表为原创了,给图片加了个水印 下拉刷新功能在安卓和iOS中非常常见,一般实现这样的功能都是直接使用第三方的库,网上能找到很多这样的开源库.然而在Xamarin. ...
- android使用PullToRefresh实现上拉加载和下拉刷新效果
其实很早前就在博客园中也写过官方的下拉刷新控件SwipeRefreshLayout,但是这个控件仅仅支持下拉刷新,用起来还算可以.然而在我们实际开发应用中,很多地方都不止有下拉刷新,而且还有上拉加载的 ...
- android官方下拉刷新控件SwipeRefreshLayout的使用
可能开发安卓的人大多数都用过很多下拉刷新的开源组件,但是今天用了官方v4支持包的SwipeRefreshLayout觉得效果也蛮不错的,特拿出来分享. 简介:SwipeRefreshLayout组件只 ...
- 分页插件思想:pc加载更多功能和移动端下拉刷新加载数据
感觉一个人玩lol也没意思了,玩会手机,看到这个下拉刷新功能就写了这个demo! 这个demo写的比较随意,咱不能当做插件使用,基本思想是没问题的,要用就自己封装吧! 直接上代码分析下吧! 布局: & ...
- 完美解决,浏览器下拉显示网址问题 | 完美解决,使用原生 scroll 写下拉刷新
在 web 开发过程中我们经常遇到,不想让用户下拉看到我的地址,也有时候在 div 中没有惯性滚动,就此也出了 iScroll 这种关于滚动条的框架,但是就为了一个体验去使用一个框架好像又不值得,今天 ...
随机推荐
- 微信小程序——简易动画案例
wxml: <view class="container"> <view animation="{{animation}}" class=&q ...
- Uva10795 A Different Task
A Different Task https://vjudge.net/problem/UVA-10795 题目大意:给定一个汉诺塔初末状态,求从初状态到末状态最少需要多少步. 考虑最大的一个初末不同 ...
- Luogu P2864 [USACO06JAN]树林The Grove(bfs)
P2864 [USACO06JAN]树林The Grove(bfs) 题面 题目描述 The pasture contains a small, contiguous grove of trees t ...
- 有趣的纯CSS实现动态晴阴雨雪
我们先来看看实现的效果吧 非常的美腻,对吧.这个是纯css,且单标签实现的哦~ 先贴完整代码,我们再来看看这个里面究竟有什么可以借鉴的知识点 <!DOCTYPE html> <htm ...
- 洛谷P3306 随机数生成器
题意:给你一个数列,a1 = x,ai = (A * ai-1 + B) % P,求第一个是t的是哪一项,或者永远不会有t. 解:循环节不会超过P.我们使用BSGS的思想,预处理从t开始跳√P步的,插 ...
- mac mamp host 配置
<VirtualHost *:80> DocumentRoot "/Users/xuxu/www" ServerName localhost <Directory ...
- PHP--时间格式处理
Ymd格式转Y-m-d或转成时间戳将Ymd格式如19930811转成1993-08-11格式 date('Y-m-d',strtotime('19930811') 将Ymd格式如19930811转成时 ...
- spring cloud深入学习(五)-----熔断器Hystrix
雪崩效应 在微服务架构中通常会有多个服务层调用,基础服务的故障可能会导致级联故障,进而造成整个系统不可用的情况,这种现象被称为服务雪崩效应.服务雪崩效应是一种因“服务提供者”的不可用导致“服务消费者” ...
- Python学习(一) 安装,环境搭建,IDE
第一篇废话太多了,我的博客最主要的是给自己看的,大家觉得还凑合也可以看看,能说自己想法的就更好了,因为一个人的思想是有局限性的.集思广益,自己的认知才不会被禁锢. 注:其他的系统没装,在Windows ...
- ZooKeeper的分布式锁实现
分布式锁一般有三种实现方式: 1. 数据库乐观锁: 2. 基于Redis的分布式锁: 3. 基于ZooKeeper的分布式锁. 本篇博客将介绍第三种方式,基于Zookeeper实现分布式锁.虽然网上已 ...