标签:style blog io ar color sp strong on div
Tween公式 4个参数
t:current time(当前时间)
b:beginning value(初始值)
c: change in value(变化量)
d:duration(持续时间) return (目标点)
1 var Tween = { 2 linear: function (t, b, c, d){ //匀速 3 return c*t/d + b; 4 }, 5 easeIn: function(t, b, c, d){ //加速曲线 6 return c*(t/=d)*t + b; 7 }, 8 easeOut: function(t, b, c, d){ //减速曲线 9 return -c *(t/=d)*(t-2) + b; 10 }, 11 easeBoth: function(t, b, c, d){ //加速减速曲线 12 if ((t/=d/2) < 1) { 13 return c/2*t*t + b; 14 } 15 return -c/2 * ((--t)*(t-2) - 1) + b; 16 }, 17 easeInStrong: function(t, b, c, d){ //加加速曲线 18 return c*(t/=d)*t*t*t + b; 19 }, 20 easeOutStrong: function(t, b, c, d){ //减减速曲线 21 return -c * ((t=t/d-1)*t*t*t - 1) + b; 22 }, 23 easeBothStrong: function(t, b, c, d){ //加加速减减速曲线 24 if ((t/=d/2) < 1) { 25 return c/2*t*t*t*t + b; 26 } 27 return -c/2 * ((t-=2)*t*t*t - 2) + b; 28 }, 29 elasticIn: function(t, b, c, d, a, p){ //正弦衰减曲线(弹动渐入) 30 if (t === 0) { 31 return b; 32 } 33 if ( (t /= d) == 1 ) { 34 return b+c; 35 } 36 if (!p) { 37 p=d*0.3; 38 } 39 if (!a || a < Math.abs(c)) { 40 a = c; 41 var s = p/4; 42 } else { 43 var s = p/(2*Math.PI) * Math.asin (c/a); 44 } 45 return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; 46 }, 47 elasticOut: function(t, b, c, d, a, p){ //正弦增强曲线(弹动渐出) 48 if (t === 0) { 49 return b; 50 } 51 if ( (t /= d) == 1 ) { 52 return b+c; 53 } 54 if (!p) { 55 p=d*0.3; 56 } 57 if (!a || a < Math.abs(c)) { 58 a = c; 59 var s = p / 4; 60 } else { 61 var s = p/(2*Math.PI) * Math.asin (c/a); 62 } 63 return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b; 64 }, 65 elasticBoth: function(t, b, c, d, a, p){ 66 if (t === 0) { 67 return b; 68 } 69 if ( (t /= d/2) == 2 ) { 70 return b+c; 71 } 72 if (!p) { 73 p = d*(0.3*1.5); 74 } 75 if ( !a || a < Math.abs(c) ) { 76 a = c; 77 var s = p/4; 78 } 79 else { 80 var s = p/(2*Math.PI) * Math.asin (c/a); 81 } 82 if (t < 1) { 83 return - 0.5*(a*Math.pow(2,10*(t-=1)) * 84 Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; 85 } 86 return a*Math.pow(2,-10*(t-=1)) * 87 Math.sin( (t*d-s)*(2*Math.PI)/p )*0.5 + c + b; 88 }, 89 backIn: function(t, b, c, d, s){ //回退加速(回退渐入) 90 if (typeof s == ‘undefined‘) { 91 s = 1.70158; 92 } 93 return c*(t/=d)*t*((s+1)*t - s) + b; 94 }, 95 backOut: function(t, b, c, d, s){ 96 if (typeof s == ‘undefined‘) { 97 s = 3.70158; //回缩的距离 98 } 99 return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b; 100 }, 101 backBoth: function(t, b, c, d, s){ 102 if (typeof s == ‘undefined‘) { 103 s = 1.70158; 104 } 105 if ((t /= d/2 ) < 1) { 106 return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b; 107 } 108 return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b; 109 }, 110 bounceIn: function(t, b, c, d){ //弹球减振(弹球渐出) 111 return c - Tween[‘bounceOut‘](d-t, 0, c, d) + b; 112 }, 113 bounceOut: function(t, b, c, d){ 114 if ((t/=d) < (1/2.75)) { 115 return c*(7.5625*t*t) + b; 116 } else if (t < (2/2.75)) { 117 return c*(7.5625*(t-=(1.5/2.75))*t + 0.75) + b; 118 } else if (t < (2.5/2.75)) { 119 return c*(7.5625*(t-=(2.25/2.75))*t + 0.9375) + b; 120 } 121 return c*(7.5625*(t-=(2.625/2.75))*t + 0.984375) + b; 122 }, 123 bounceBoth: function(t, b, c, d){ 124 if (t < d/2) { 125 return Tween[‘bounceIn‘](t*2, 0, c, d) * 0.5 + b; 126 } 127 return Tween[‘bounceOut‘](t*2-d, 0, c, d) * 0.5 + c*0.5 + b; 128 } 129 }
标签:style blog io ar color sp strong on div
原文地址:http://www.cnblogs.com/webskill/p/4164686.html