Zepto-refresh NPM

Zepto.refresh.js

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

查看效果地址

初始化

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 Object配置

参数	类型	说明
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	加载更多回调