Created
March 5, 2012 11:26
-
-
Save icai/1977933 to your computer and use it in GitHub Desktop.
Tween function
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var Tween = { | |
Linear:function (start,alter,curTime,dur) {return start+curTime/dur*alter;},//最简单的线性变化,即匀速运动 | |
Quad:{//二次方缓动 | |
easeIn:function (start,alter,curTime,dur) { | |
return start+Math.pow(curTime/dur,2)*alter; | |
}, | |
easeOut:function (start,alter,curTime,dur) { | |
var progress =curTime/dur; | |
return start-(Math.pow(progress,2)-2*progress)*alter; | |
}, | |
easeInOut:function (start,alter,curTime,dur) { | |
var progress =curTime/dur*2; | |
return (progress<1?Math.pow(progress,2):-((--progress)*(progress-2) - 1))*alter/2+start; | |
} | |
}, | |
Cubic:{//三次方缓动 | |
easeIn:function (start,alter,curTime,dur) { | |
return start+Math.pow(curTime/dur,3)*alter; | |
}, | |
easeOut:function (start,alter,curTime,dur) { | |
var progress =curTime/dur; | |
return start-(Math.pow(progress,3)-Math.pow(progress,2)+1)*alter; | |
}, | |
easeInOut:function (start,alter,curTime,dur) { | |
var progress =curTime/dur*2; | |
return (progress<1?Math.pow(progress,3):((progress-=2)*Math.pow(progress,2) + 2))*alter/2+start; | |
} | |
}, | |
Quart:{//四次方缓动 | |
easeIn:function (start,alter,curTime,dur) { | |
return start+Math.pow(curTime/dur,4)*alter; | |
}, | |
easeOut:function (start,alter,curTime,dur) { | |
var progress =curTime/dur; | |
return start-(Math.pow(progress,4)-Math.pow(progress,3)-1)*alter; | |
}, | |
easeInOut:function (start,alter,curTime,dur) { | |
var progress =curTime/dur*2; | |
return (progress<1?Math.pow(progress,4):-((progress-=2)*Math.pow(progress,3) - 2))*alter/2+start; | |
} | |
}, | |
Quint:{//五次方缓动 | |
easeIn:function (start,alter,curTime,dur) { | |
return start+Math.pow(curTime/dur,5)*alter; | |
}, | |
easeOut:function (start,alter,curTime,dur) { | |
var progress =curTime/dur; | |
return start-(Math.pow(progress,5)-Math.pow(progress,4)+1)*alter; | |
}, | |
easeInOut:function (start,alter,curTime,dur) { | |
var progress =curTime/dur*2; | |
return (progress<1?Math.pow(progress,5):((progress-=2)*Math.pow(progress,4) +2))*alter/2+start; | |
} | |
}, | |
Sine :{//正弦曲线缓动 | |
easeIn:function (start,alter,curTime,dur) { | |
return start-(Math.cos(curTime/dur*Math.PI/2)-1)*alter; | |
}, | |
easeOut:function (start,alter,curTime,dur) { | |
return start+Math.sin(curTime/dur*Math.PI/2)*alter; | |
}, | |
easeInOut:function (start,alter,curTime,dur) { | |
return start-(Math.cos(curTime/dur*Math.PI/2)-1)*alter/2; | |
} | |
}, | |
Expo: {//指数曲线缓动 | |
easeIn:function (start,alter,curTime,dur) { | |
return curTime?(start+alter*Math.pow(2,10*(curTime/dur-1))):start; | |
}, | |
easeOut:function (start,alter,curTime,dur) { | |
return (curTime==dur)?(start+alter):(start-(Math.pow(2,-10*curTime/dur)+1)*alter); | |
}, | |
easeInOut:function (start,alter,curTime,dur) { | |
if (!curTime) {return start;} | |
if (curTime==dur) {return start+alter;} | |
var progress =curTime/dur*2; | |
if (progress < 1) { | |
return alter/2*Math.pow(2,10* (progress-1))+start; | |
} else { | |
return alter/2* (-Math.pow(2, -10*--progress) + 2) +start; | |
} | |
} | |
}, | |
Circ :{//圆形曲线缓动 | |
easeIn:function (start,alter,curTime,dur) { | |
return start-alter*Math.sqrt(-Math.pow(curTime/dur,2)); | |
}, | |
easeOut:function (start,alter,curTime,dur) { | |
return start+alter*Math.sqrt(1-Math.pow(curTime/dur-1)); | |
}, | |
easeInOut:function (start,alter,curTime,dur) { | |
var progress =curTime/dur*2; | |
return (progress<1?1-Math.sqrt(1-Math.pow(progress,2)):(Math.sqrt(1 - Math.pow(progress-2,2)) + 1))*alter/2+start; | |
} | |
}, | |
Elastic: {//指数衰减的正弦曲线缓动 | |
easeIn:function (start,alter,curTime,dur,extent,cycle) { | |
if (!curTime) {return start;} | |
if ((curTime==dur)==1) {return start+alter;} | |
if (!cycle) {cycle=dur*0.3;} | |
var s; | |
if (!extent || extent< Math.abs(alter)) { | |
extent=alter; | |
s = cycle/4; | |
} else {s=cycle/(Math.PI*2)*Math.asin(alter/extent);} | |
return start-extent*Math.pow(2,10*(curTime/dur-1)) * Math.sin((curTime-dur-s)*(2*Math.PI)/cycle); | |
}, | |
easeOut:function (start,alter,curTime,dur,extent,cycle) { | |
if (!curTime) {return start;} | |
if (curTime==dur) {return start+alter;} | |
if (!cycle) {cycle=dur*0.3;} | |
var s; | |
if (!extent || extent< Math.abs(alter)) { | |
extent=alter; | |
s =cycle/4; | |
} else {s=cycle/(Math.PI*2)*Math.asin(alter/extent);} | |
return start+alter+extent*Math.pow(2,-curTime/dur*10)*Math.sin((curTime-s)*(2*Math.PI)/cycle); | |
}, | |
easeInOut:function (start,alter,curTime,dur,extent,cycle) { | |
if (!curTime) {return start;} | |
if (curTime==dur) {return start+alter;} | |
if (!cycle) {cycle=dur*0.45;} | |
var s; | |
if (!extent || extent< Math.abs(alter)) { | |
extent=alter; | |
s =cycle/4; | |
} else {s=cycle/(Math.PI*2)*Math.asin(alter/extent);} | |
var progress = curTime/dur*2; | |
if (progress<1) { | |
return start-0.5*extent*Math.pow(2,10*(progress-=1))*Math.sin( (progress*dur-s)*(2*Math.PI)/cycle); | |
} else { | |
return start+alter+0.5*extent*Math.pow(2,-10*(progress-=1)) * Math.sin( (progress*dur-s)*(2*Math.PI)/cycle); | |
} | |
} | |
}, | |
Back:{ | |
easeIn: function (start,alter,curTime,dur,s){ | |
if (typeof s == "undefined") {s = 1.70158;} | |
return start+alter*(curTime/=dur)*curTime*((s+1)*curTime - s); | |
}, | |
easeOut: function (start,alter,curTime,dur,s) { | |
if (typeof s == "undefined") {s = 1.70158;} | |
return start+alter*((curTime=curTime/dur-1)*curTime*((s+1)*curTime + s) + 1); | |
}, | |
easeInOut: function (start,alter,curTime,dur,s){ | |
if (typeof s == "undefined") {s = 1.70158;} | |
if ((curTime/=dur/2) < 1) { | |
return start+alter/2*(Math.pow(curTime,2)*(((s*=(1.525))+1)*curTime- s)); | |
} | |
return start+alter/2*((curTime-=2)*curTime*(((s*=(1.525))+1)*curTime+ s)+2); | |
} | |
}, | |
Bounce:{ | |
easeIn: function(start,alter,curTime,dur){ | |
return start+alter-Tween.Bounce.easeOut(0,alter,dur-curTime,dur); | |
}, | |
easeOut: function(start,alter,curTime,dur){ | |
if ((curTime/=dur) < (1/2.75)) { | |
return alter*(7.5625*Math.pow(curTime,2))+start; | |
} else if (curTime < (2/2.75)) { | |
return alter*(7.5625*(curTime-=(1.5/2.75))*curTime + .75)+start; | |
} else if (curTime< (2.5/2.75)) { | |
return alter*(7.5625*(curTime-=(2.25/2.75))*curTime + .9375)+start; | |
} else { | |
return alter*(7.5625*(curTime-=(2.625/2.75))*curTime + .984375)+start; | |
} | |
}, | |
easeInOut: function (start,alter,curTime,dur){ | |
if (curTime< dur/2) { | |
return Tween.Bounce.easeIn(0,alter,curTime*2,dur) *0.5+start; | |
} else { | |
return Tween.Bounce.easeOut(0,alter,curTime*2-dur,dur) *0.5 + alter*0.5 +start; | |
} | |
} | |
} | |
}; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment