zepto-refresh icon indicating copy to clipboard operation
zepto-refresh copied to clipboard

实现下拉到底部和上拉到顶部再拉就出现刷新效果

Zepto.refresh.js

实现下拉到底部和上拉到顶部再拉就出现刷新效果

查看效果地址

Zepto.refresh

初始化

NPM

npm install --save zepto-refresh

直接HTML引入

<script src="zepto.min.js"></script>	
<script src="zepto.refresh.js"></script>

使用

NPM

var Refresh = require('zepto-refresh');

Refresh('.wrap', {
  // 内容元素
  contentEl: '#J_scroller',
  // 开启刷新事件,默认true
  isRefresh: true,
  // 刷新回调
  refreshCallback: function(complete) {

  },
  // 加载更多回调
  loadingMoreCallback: function(complete) {

  }
});

HTML

$(window).refresh({
  // 内容元素
  contentEl: '#J_scroller',
  // 开启刷新事件,默认true
  isRefresh: true,
  // 刷新回调
  refreshCallback: function(complete) {

  },
  // 加载更多回调
  loadingMoreCallback: function(complete) {

  }
});
```	

## options <code>Object</code>配置
| 参数                               | 类型          | 说明                  |
| ---------------------------------- | ------------- | --------------------- |
| contentEl: #J_content              | String        | 内容ID                |
| isRefresh: true                    | Boolean       | 默认开启刷新	         | 
| isLoadingMore: true                | Boolean       | 默认开启加载更多	     | 
| distanceToRefresh: 100             | Number        | 下拉可刷新高度	     | 
| minDistanceToRefresh: 100          | Number        | 下拉最小阈值   	     | 
| maxDistanceToRefresh: 200          | Number        | 下拉最大阈值   	     | 
| interval: 5                        | Number        | 更新限制时间, 默认不限制 | 
| refreshCallback: function(){}      | Function      | 刷新回调              | 
| loadingMoreCallback: function(){}  | Function      | 加载更多回调          | 


## 更新版本
[v1.2内容](https://github.com/nevergiveup-j/zepto-refresh/wiki/%E6%9B%B4%E6%96%B0v1.2%E5%86%85%E5%AE%B9)