From 9a489e747391d9dfb3f9dd245f871b4a91f49657 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=A5=BF=E9=97=A8?= <1745745@qq.com>
Date: Fri, 18 Dec 2015 18:56:49 +0800
Subject: [PATCH] 0.6.0
---
Changelog.md | 6 +++++-
README.md | 11 +++++++----
dist/dropload.js | 13 ++++++++++---
dist/dropload.min.js | 4 ++--
examples/load-top-bottom.html | 3 ++-
5 files changed, 26 insertions(+), 11 deletions(-)
diff --git a/Changelog.md b/Changelog.md
index 343edf6..6eb0e65 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -1,8 +1,12 @@
+### 0.6.0(151218)
+
+* 增加参数threshold提前加载距离
+
### 0.5.0(151217)
* 上拉加载改为滑到底部自动加载
* 删除上拉加载中的↑释放更新
-* 增加无数据`me.noData()` API
+* 增加无数据`noData()` API
### 0.4.0(150927)
diff --git a/README.md b/README.md
index 9c03e25..c91913b 100644
--- a/README.md
+++ b/README.md
@@ -4,6 +4,10 @@
## 背景介绍
+### 0.6.0(151218)
+
+根据网友提议增加提前加载距离threshold,适用于上拉加载更多功能。默认显示到加载区高度2/3时加载。
+
### 0.5.0(151217)
感谢交流群里网友各种吐槽上拉加载抖动。发现`touch`和`scroll`同时作用会发生抖动,干脆把上拉加载改为滑到底部自动加载。如依旧需要上拉加载效果,可以下载[releases0.4.0版本](https://github.com/ximan/dropload/releases/tag/0.4.0)。
@@ -79,6 +83,7 @@ $('.element').dropload({
| domUp | 上方DOM | {
domClass : 'dropload-up',
domRefresh : '<div class="dropload-refresh">↓下拉刷新</div>',
domUpdate : '<div class="dropload-update">↑释放更新</div>',
domLoad : '<div class="dropload-load">○加载中...</div>'
} | 数组 |
| domDown | 下方DOM | {
domClass : 'dropload-down',
domRefresh : '<div class="dropload-refresh">↑上拉加载更多</div>',
domLoad : '<div class="dropload-load">○加载中...</div>',
domNoData : '<div class="dropload-noData">暂无数据</div>'
} | 数组 |
| distance | 拉动距离 | 50 | 数字 |
+| threshold | 提前加载距离 | 加载区高度2/3 | 正整数 |
| loadUpFn | 上方function | 空 | function(me){
//你的代码
me.resetload();
} |
| loadDownFn | 下方function | 空 | function(me){
//你的代码
me.resetload();
} |
@@ -94,11 +99,9 @@ $('.element').dropload({
## 最新版本
-### 0.5.0(151217)
+### 0.6.0(151218)
-* 上拉加载改为滑到底部自动加载
-* 删除上拉加载中的↑释放更新
-* 增加无数据`me.noData()` API
+* 增加参数threshold提前加载距离
[所有更新日志](Changelog.md)
diff --git a/dist/dropload.js b/dist/dropload.js
index d482b39..0ab333b 100644
--- a/dist/dropload.js
+++ b/dist/dropload.js
@@ -1,7 +1,7 @@
/**
* dropload
* 西门
- * 0.5.0(151217)
+ * 0.6.0(151218)
*/
;(function($){
@@ -46,6 +46,7 @@
domNoData : '
暂无数据
'
},
distance : 50, // 拉动距离
+ threshold : '', // 提前加载距离
loadUpFn : '', // 上方function
loadDownFn : '' // 下方function
}, options);
@@ -101,8 +102,14 @@
// 加载下方
me.$scrollArea.on('scroll',function(){
me._scrollTop = me.$scrollArea.scrollTop();
- // 当滑到加载区2/3处时加载
- if(me.opts.loadDownFn != '' && !me.loading && !me.isLock && (me._scrollContentHeight - Math.floor(me.$domDown.height()*1/3)) <= (me._scrollWindowHeight + me._scrollTop)){
+ if(me.opts.threshold === ''){
+ // 默认滑到加载区2/3处时加载
+ me._threshold = Math.floor(me.$domDown.height()*1/3);
+ }else{
+ me._threshold = me.opts.threshold;
+ }
+
+ if(me.opts.loadDownFn != '' && !me.loading && !me.isLock && (me._scrollContentHeight - me._threshold) <= (me._scrollWindowHeight + me._scrollTop)){
me.direction = 'up';
me.$domDown.html(me.opts.domDown.domLoad);
me.loading = true;
diff --git a/dist/dropload.min.js b/dist/dropload.min.js
index efc4c0e..c2cd9fb 100644
--- a/dist/dropload.min.js
+++ b/dist/dropload.min.js
@@ -1,6 +1,6 @@
/**
* dropload
* 西门
- * 0.5.0(151217)
+ * 0.6.0(151218)
*/
-!function(a){"use strict";function g(a){a.touches||(a.touches=a.originalEvent.touches)}function h(a,b){b._startY=a.touches[0].pageY,b.touchScrollTop=b.$scrollArea.scrollTop()}function i(b,c){c._curY=b.touches[0].pageY,c._moveY=c._curY-c._startY,c._moveY>0?c.direction="down":c._moveY<0&&(c.direction="up");var d=Math.abs(c._moveY);""!=c.opts.loadUpFn&&c.touchScrollTop<=0&&"down"==c.direction&&(b.preventDefault(),c.$domUp=a("."+c.opts.domUp.domClass),c.upInsertDOM||(c.$element.prepend(''),c.upInsertDOM=!0),l(c.$domUp,0),d<=c.opts.distance?(c._offsetY=d,c.$domUp.html(c.opts.domUp.domRefresh)):d>c.opts.distance&&d<=2*c.opts.distance?(c._offsetY=c.opts.distance+.5*(d-c.opts.distance),c.$domUp.html(c.opts.domUp.domUpdate)):c._offsetY=c.opts.distance+.5*c.opts.distance+.2*(d-2*c.opts.distance),c.$domUp.css({height:c._offsetY}))}function j(b){var c=Math.abs(b._moveY);""!=b.opts.loadUpFn&&b.touchScrollTop<=0&&"down"==b.direction&&(l(b.$domUp,300),c>b.opts.distance?(b.$domUp.css({height:b.$domUp.children().height()}),b.$domUp.html(b.opts.domUp.domLoad),b.loading=!0,b.opts.loadUpFn(b)):b.$domUp.css({height:"0"}).on("webkitTransitionEnd transitionend",function(){b.upInsertDOM=!1,a(this).remove()}),b._moveY=0)}function k(a){a._scrollContentHeight=a.opts.scrollArea==b?e.height():a.$element[0].scrollHeight}function l(a,b){a.css({"-webkit-transition":"all "+b+"ms",transition:"all "+b+"ms"})}var f,b=window,c=document,d=a(b),e=a(c);a.fn.dropload=function(a){return new f(this,a)},f=function(b,c){var d=this;d.$element=a(b),d.upInsertDOM=!1,d.loading=!1,d.isLock=!1,d.isData=!0,d._scrollTop=0,d.init(c)},f.prototype.init=function(f){var k=this;k.opts=a.extend({},{scrollArea:k.$element,domUp:{domClass:"dropload-up",domRefresh:'↓下拉刷新
',domUpdate:'↑释放更新
',domLoad:'加载中...
'},domDown:{domClass:"dropload-down",domRefresh:'↑上拉加载更多
',domLoad:'加载中...
',domNoData:'暂无数据
'},distance:50,loadUpFn:"",loadDownFn:""},f),""!=k.opts.loadDownFn&&(k.$element.append(''+k.opts.domDown.domRefresh+"
"),k.$domDown=a("."+k.opts.domDown.domClass)),k.opts.scrollArea==b?(k.$scrollArea=d,k._scrollContentHeight=e.height(),k._scrollWindowHeight=c.documentElement.clientHeight):(k.$scrollArea=k.opts.scrollArea,k._scrollContentHeight=k.$element[0].scrollHeight,k._scrollWindowHeight=k.$element.height()),d.on("resize",function(){k._scrollWindowHeight=k.opts.scrollArea==b?b.innerHeight:k.$element.height()}),k.$element.on("touchstart",function(a){k.loading||k.isLock||(g(a),h(a,k))}),k.$element.on("touchmove",function(a){k.loading||k.isLock||(g(a,k),i(a,k))}),k.$element.on("touchend",function(){k.loading||k.isLock||j(k)}),k.$scrollArea.on("scroll",function(){k._scrollTop=k.$scrollArea.scrollTop(),""!=k.opts.loadDownFn&&!k.loading&&!k.isLock&&k._scrollContentHeight-Math.floor(1*k.$domDown.height()/3)<=k._scrollWindowHeight+k._scrollTop&&(k.direction="up",k.$domDown.html(k.opts.domDown.domLoad),k.loading=!0,k.opts.loadDownFn(k))})},f.prototype.lock=function(){var a=this;a.isLock=!0},f.prototype.unlock=function(){var a=this;a.isLock=!1},f.prototype.noData=function(){var a=this;a.isData=!1},f.prototype.resetload=function(){var b=this;"down"==b.direction&&b.upInsertDOM?b.$domUp.css({height:"0"}).on("webkitTransitionEnd transitionend",function(){b.loading=!1,b.upInsertDOM=!1,a(this).remove(),k(b)}):"up"==b.direction&&(b.loading=!1,b.isData?(b.$domDown.html(b.opts.domDown.domRefresh),k(b)):b.$domDown.html(b.opts.domDown.domNoData))}}(window.Zepto||window.jQuery);
\ No newline at end of file
+!function(a){"use strict";function g(a){a.touches||(a.touches=a.originalEvent.touches)}function h(a,b){b._startY=a.touches[0].pageY,b.touchScrollTop=b.$scrollArea.scrollTop()}function i(b,c){c._curY=b.touches[0].pageY,c._moveY=c._curY-c._startY,c._moveY>0?c.direction="down":c._moveY<0&&(c.direction="up");var d=Math.abs(c._moveY);""!=c.opts.loadUpFn&&c.touchScrollTop<=0&&"down"==c.direction&&(b.preventDefault(),c.$domUp=a("."+c.opts.domUp.domClass),c.upInsertDOM||(c.$element.prepend(''),c.upInsertDOM=!0),l(c.$domUp,0),d<=c.opts.distance?(c._offsetY=d,c.$domUp.html(c.opts.domUp.domRefresh)):d>c.opts.distance&&d<=2*c.opts.distance?(c._offsetY=c.opts.distance+.5*(d-c.opts.distance),c.$domUp.html(c.opts.domUp.domUpdate)):c._offsetY=c.opts.distance+.5*c.opts.distance+.2*(d-2*c.opts.distance),c.$domUp.css({height:c._offsetY}))}function j(b){var c=Math.abs(b._moveY);""!=b.opts.loadUpFn&&b.touchScrollTop<=0&&"down"==b.direction&&(l(b.$domUp,300),c>b.opts.distance?(b.$domUp.css({height:b.$domUp.children().height()}),b.$domUp.html(b.opts.domUp.domLoad),b.loading=!0,b.opts.loadUpFn(b)):b.$domUp.css({height:"0"}).on("webkitTransitionEnd transitionend",function(){b.upInsertDOM=!1,a(this).remove()}),b._moveY=0)}function k(a){a._scrollContentHeight=a.opts.scrollArea==b?e.height():a.$element[0].scrollHeight}function l(a,b){a.css({"-webkit-transition":"all "+b+"ms",transition:"all "+b+"ms"})}var f,b=window,c=document,d=a(b),e=a(c);a.fn.dropload=function(a){return new f(this,a)},f=function(b,c){var d=this;d.$element=a(b),d.upInsertDOM=!1,d.loading=!1,d.isLock=!1,d.isData=!0,d._scrollTop=0,d.init(c)},f.prototype.init=function(f){var k=this;k.opts=a.extend({},{scrollArea:k.$element,domUp:{domClass:"dropload-up",domRefresh:'↓下拉刷新
',domUpdate:'↑释放更新
',domLoad:'加载中...
'},domDown:{domClass:"dropload-down",domRefresh:'↑上拉加载更多
',domLoad:'加载中...
',domNoData:'暂无数据
'},distance:50,threshold:"",loadUpFn:"",loadDownFn:""},f),""!=k.opts.loadDownFn&&(k.$element.append(''+k.opts.domDown.domRefresh+"
"),k.$domDown=a("."+k.opts.domDown.domClass)),k.opts.scrollArea==b?(k.$scrollArea=d,k._scrollContentHeight=e.height(),k._scrollWindowHeight=c.documentElement.clientHeight):(k.$scrollArea=k.opts.scrollArea,k._scrollContentHeight=k.$element[0].scrollHeight,k._scrollWindowHeight=k.$element.height()),d.on("resize",function(){k._scrollWindowHeight=k.opts.scrollArea==b?b.innerHeight:k.$element.height()}),k.$element.on("touchstart",function(a){k.loading||k.isLock||(g(a),h(a,k))}),k.$element.on("touchmove",function(a){k.loading||k.isLock||(g(a,k),i(a,k))}),k.$element.on("touchend",function(){k.loading||k.isLock||j(k)}),k.$scrollArea.on("scroll",function(){k._scrollTop=k.$scrollArea.scrollTop(),k._threshold=""===k.opts.threshold?Math.floor(1*k.$domDown.height()/3):k.opts.threshold,""!=k.opts.loadDownFn&&!k.loading&&!k.isLock&&k._scrollContentHeight-k._threshold<=k._scrollWindowHeight+k._scrollTop&&(k.direction="up",k.$domDown.html(k.opts.domDown.domLoad),k.loading=!0,k.opts.loadDownFn(k))})},f.prototype.lock=function(){var a=this;a.isLock=!0},f.prototype.unlock=function(){var a=this;a.isLock=!1},f.prototype.noData=function(){var a=this;a.isData=!1},f.prototype.resetload=function(){var b=this;"down"==b.direction&&b.upInsertDOM?b.$domUp.css({height:"0"}).on("webkitTransitionEnd transitionend",function(){b.loading=!1,b.upInsertDOM=!1,a(this).remove(),k(b)}):"up"==b.direction&&(b.loading=!1,b.isData?(b.$domDown.html(b.opts.domDown.domRefresh),k(b)):b.$domDown.html(b.opts.domDown.domNoData))}}(window.Zepto||window.jQuery);
\ No newline at end of file
diff --git a/examples/load-top-bottom.html b/examples/load-top-bottom.html
index d86bc02..10f9b8d 100644
--- a/examples/load-top-bottom.html
+++ b/examples/load-top-bottom.html
@@ -296,7 +296,8 @@ 12文字描述文字描述文字描述文字描述文字描述
me.resetload();
}
});
- }
+ },
+ threshold : 50
});
});