var scrollCtrl = function(list,bar,ch,bh){
var ctrl = {
obj:null,
barobj:null,
listH:0,
conH:ch,
barH:bh,
delta:{},
startP:{},
nowPos:0,
tmpPos:0,
oftH:0,
stime:0,
mvPos:0,
handleEvent:function(e){
switch(e.type) {
case 'touchstart':
this.start(e);
break;
case 'touchmove':
this.move(e);
break;
case 'touchend':
this.end(e);
break;
}
},
start:function(e){
var touches = e.touches[0];
this.startP = {
y: touches.pageY,
x: touches.pageX,
time: +new Date
};
this.delta = {};
this.tmpPos = this.nowPos;
this.stime = +new Date;
this.mvPos = 0;
},
move:function(e){
if(this.conH>this.listH) {
return;
}
e.preventDefault();
if (e.touches.length > 1 || e.scale && e.scale !== 1) {
return;
}
var touches = e.touches[0];
if(!this.startP) {
this.startP = {
y: touches.pageY,
x: touches.pageX,
time: +new Date
};
}
this.delta = {
y: touches.pageY - this.startP.y,
x: touches.pageX - this.startP.x
}
var ofy = this.delta.y;
if(this.conH>this.listH) {
return;
}
var tpos=this.tmpPos + ofy;
this.mvPos = ofy;
this.nowPos = tpos;
this.translate(this.obj.get(0),this.nowPos,0);
var py = -(this.barH-this.oftH)*this.nowPos/(this.listH-this.conH);
this.translate(this.barobj.get(0),py,0);
},
end:function(){
if(Math.abs(this.mvPos)>0) {
if(this.nowPos>0) {
this.nowPos = 0;
this.translate(this.obj.get(0),this.nowPos,500);
var py = -(this.barH-this.oftH)*this.nowPos/(this.listH-this.conH);
this.translate(this.barobj.get(0),py,500);
} else if(-this.nowPos>this.listH-this.conH) {
this.nowPos = -(this.listH-this.conH);
this.translate(this.obj.get(0),this.nowPos, 500);
var py = -(this.barH-this.oftH)*this.nowPos/(this.listH-this.conH);
this.translate(this.barobj.get(0),py,500);
} else {
var etime = +new Date;
var dt = etime-this.stime;
if(Math.abs(this.mvPos)>20) {
var spd = this.mvPos*300/dt;
var tp = this.nowPos+spd;
if(tp>0) {
tp=0;
} else if(-tp>this.listH-this.conH) {
tp = -this.listH+this.conH;
}
this.nowPos = tp;
this.mvPos = 0;
this.translate(this.obj.get(0),tp, 600);
var py = -(this.barH-this.oftH)*this.nowPos/(this.listH-this.conH);
this.translate(this.barobj.get(0),py,600);
}
}
}
},
translate:function(obj, disty,speed) {
var style = obj && obj.style;
if (!style) return;
style.webkitTransitionTimingFunction =
style.transitionTimingFunction = 'ease-out';
style.webkitTransitionDuration =
style.transitionDuration = speed + 'ms';
style.webkitTransform = 'translate(0px, ' + disty + 'px)' + 'translateZ(0)';
style.msTransform =
style.MozTransform =
style.OTransform = 'translate(0px, ' + disty + 'px)';
},
fix:function(){
this.translate(this.obj.get(0),this.nowPos,0);
},
reset:function(){
this.listH = this.obj.height();
this.translate(this.obj.get(0),0);
if(this.conH>this.listH) {
this.barobj.hide();
} else {
var heightVar=this.barH/this.listH;
var ph =Math.floor(this.barH*Math.pow(heightVar,0.3));
this.oftH = ph;
this.barobj.height(ph);
}
},
init:function(){
this.obj = $(list);
if(this.obj.get(0)) {
this.obj.get(0).addEventListener('touchstart', this, false);
this.obj.get(0).addEventListener('touchmove', this, false);
this.obj.get(0).addEventListener('touchend', this, false);
}
this.barobj = $(bar);
}
}
ctrl.init();
return ctrl;
}
var rankListCtrl = new scrollCtrl(‘#rankList’,’#rankBar’,380,380);