实现下拉到底部和上拉到顶部再拉就出现刷新效果
npm install --save zepto-refresh
<script src="zepto.min.js"></script>
<script src="zepto.refresh.js"></script>
var Refresh = require('zepto-refresh');
Refresh('.wrap', {
// 内容元素
contentEl: '#J_scroller',
// 开启刷新事件,默认true
isRefresh: true,
// 刷新回调
refreshCallback: function(complete) {
},
// 加载更多回调
loadingMoreCallback: function(complete) {
}
});
$(window).refresh({
// 内容元素
contentEl: '#J_scroller',
// 开启刷新事件,默认true
isRefresh: true,
// 刷新回调
refreshCallback: function(complete) {
},
// 加载更多回调
loadingMoreCallback: function(complete) {
}
});
参数 | 类型 | 说明 |
---|---|---|
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 | 加载更多回调 |