/** * jqury的下拉上拉加载插件,带样式滚动条,呵呵。 * createname:雨中磐石 * homeurl:http://www.rockoa.com/ * Copyright (c) 2016 rainrock (xh829.com) * Date:2016-11-24 */ (function ($) { function rockclass(element, options){ var me = this; var opts = $.extend({ ondragstart:function(){}, ondrag:function(){}, ondrayrl:function(){}, ondrayrlend:false, scrollbool:true, //是否添加滚动条样式 downbool:false, //是否下拉加载 upbool:false, //是否上拉加载 leftbool:false, //左 rightbool:false, //右 ondownbefore:function(){return true}, onupbefore:function(){return true}, downbgcolor:'#f1f1f1', //下拉背景 upmsgdiv:'' //上来提示区域 }, options); var obj = element; this._init=function(){ this.rand = js.getrand(); this.reloadbo = false; this.mobj = $(obj); for(var a in opts)this[a]=opts[a]; obj.addEventListener('touchstart',function(e){ me._dragstart(e); },false); obj.addEventListener('touchmove',function(e){ me._dragmove(e); },false); obj.addEventListener('touchend',function(e){ this.removeEventListener('touchmove', function(){}, false); this.removeEventListener('touchstart', function(){}, false); me._dragend(e); },false); this._initscrool(); }; this._dragstart=function(e){ if(this.reloadbo)return; $('#updowns_'+this.rand+'').remove(); this.startarr = [e.touches[0].clientX, e.touches[0].clientY, this.mobj.scrollTop(),obj.scrollHeight-this.mobj.height()]; if(this.upbool && this.upmsgdiv)this.startarr[4]=$('#'+this.upmsgdiv+'').html(); this.upstartbo = false; this.up_ysa = 0; this.movearr = [0,0]; this.ondragstart(e); }; this._dragmove=function(e){ if(this.reloadbo)return; this.upheight = 0; var hei = e.touches[0].clientY-this.startarr[1],downbo=false,upbo=false,ler = e.touches[0].clientX-this.startarr[0]; this.movearr = [ler,hei]; var updown = Math.abs(hei) > Math.abs(ler); if(this.up_ysa==0)this.up_ysa = updown ? 1 :2; //js.msg('msg',''+hei+'.'+ler+''); //下拉刷新 if(this.downbool && this.up_ysa==1){ var dowbcak = this.ondownbefore(); if(hei>0 && dowbcak && this.startarr[2]==0){ e.preventDefault(); downbo = true; } if(downbo){ this._downstart(hei, dowbcak); } if(!downbo)$('#downs_'+this.rand+'').remove(); } //上拉刷新 if(this.upbool && this.up_ysa==1){ var upback = this.onupbefore(); if(hei<0 && upback && this.startarr[2]==this.startarr[3]){ e.preventDefault(); upbo = true; } if(upbo){ this._upstart(hei, upback); } if(!upbo)this.translateY(0); } if(this.up_ysa==2){ e.preventDefault(); this.ondrayrl(ler, e); } //左滑动 if(this.leftbool && ler<0 && this.up_ysa==2){ this.mobj.css('transform','translateX('+ler+'px)'); } //右滑动 if(this.rightbool && ler>0 && this.up_ysa==2){ this.mobj.css('transform','translateX('+ler+'px)'); } this.ondrag(e,this.movearr); }; this._downstart=function(hei){ if(this.reloadbo)return; hei = hei*0.6; this.upheight = hei; if(hei>200)return; var sid = 'downs_'+this.rand+'',tx= '↓ 下拉刷新',o1; if(hei>50)tx='↑ 释放立即刷新'; if(get(sid)){ o1 = $('#'+sid+''); o1.css('height',''+hei+'px').find('div').html(tx); }else{ var s = '
刷新中...');
me.ondownsuccess ? me.ondownsuccess(e) : me.ondownok();
});
}else{
$('#'+sid+'').slideUp(200);
}
}
var bhui = true;
if(this.upheight<0){
this.translateY(0);
if(this.upheight<-50){
this.reloadbo = true;
if(this.onupsuccess){
this.onupsuccess();
}else{
setTimeout(function(){me.onupok()}, 500);
}
bhui = false;
}
}
if(this.upstartbo || bhui){
if(this.upmsgdiv)$('#'+this.upmsgdiv+'').html(this.startarr[4]);
}
if(this.ondrayrlend){
this.ondrayrlend(this.movearr[0], e);
}
};
this.ondownok=function(ts){
this.reloadbo = false;
var o1 = $('#downs_'+this.rand+'');
if(!ts)ts='√ 刷新成功';
o1.html(ts);
setTimeout(function(){o1.slideUp(200,function(){o1.remove();});}, 500);
};
this.ondownerror=function(ts){
if(!ts)ts='× 超时失败';
this.ondownok(ts);
};
this.onupok=function(ts){
this.reloadbo = false;
this.upstartbo = false;
};
this.onuperror=function(ts){
if(!ts)ts='× 超时失败';
this.ondownok(ts);
};
this._initscrool=function(){
if(!this.scrollbool)return;
var off = this.mobj.offset();
this.scrollsid = 'scrolllists_'+this.rand+'';
var l = off.left+this.mobj.width()-6;
this.scroor_h = 80;
this.scroor_hs = obj.scrollHeight;
var s = '';
s='