TWEEN.JS 補(bǔ)間動(dòng)畫

```javascript

/*

* Tween.js

* t: current time(當(dāng)前時(shí)間);

* b: beginning value(初始值)褐荷;

* c: change in value(變化量);

* d: duration(持續(xù)時(shí)間)。

* you can visit 'http://easings.net/zh-cn' to get effect

*/

varTween={

Linear:function(t,b,c,d) {

returnc*t/d+b;

},

Quad:{

easeIn:function(t,b,c,d) {

returnc*(t/=d)*t+b;

},

easeOut:function(t,b,c,d) {

return-c*(t/=d)*(t-2)+b;

},

easeInOut:function(t,b,c,d) {

if((t/=d/2)<1)returnc/2*t*t+b;

return-c/2*((--t)*(t-2)-1)+b;

}

},

Cubic:{

easeIn:function(t,b,c,d) {

returnc*(t/=d)*t*t+b;

},

easeOut:function(t,b,c,d) {

returnc*((t=t/d-1)*t*t+1)+b;

},

easeInOut:function(t,b,c,d) {

if((t/=d/2)<1)returnc/2*t*t*t+b;

returnc/2*((t-=2)*t*t+2)+b;

}

},

Quart:{

easeIn:function(t,b,c,d) {

returnc*(t/=d)*t*t*t+b;

},

easeOut:function(t,b,c,d) {

return-c*((t=t/d-1)*t*t*t-1)+b;

},

easeInOut:function(t,b,c,d) {

if((t/=d/2)<1)returnc/2*t*t*t*t+b;

return-c/2*((t-=2)*t*t*t-2)+b;

}

},

Quint:{

easeIn:function(t,b,c,d) {

returnc*(t/=d)*t*t*t*t+b;

},

easeOut:function(t,b,c,d) {

returnc*((t=t/d-1)*t*t*t*t+1)+b;

},

easeInOut:function(t,b,c,d) {

if((t/=d/2)<1)returnc/2*t*t*t*t*t+b;

returnc/2*((t-=2)*t*t*t*t+2)+b;

}

},

Sine:{

easeIn:function(t,b,c,d) {

return-c*Math.cos(t/d*(Math.PI/2))+c+b;

},

easeOut:function(t,b,c,d) {

returnc*Math.sin(t/d*(Math.PI/2))+b;

},

easeInOut:function(t,b,c,d) {

return-c/2*(Math.cos(Math.PI*t/d)-1)+b;

}

},

Expo:{

easeIn:function(t,b,c,d) {

return(t==0)?b:c*Math.pow(2,10*(t/d-1))+b;

},

easeOut:function(t,b,c,d) {

return(t==d)?b+c:c*(-Math.pow(2,-10*t/d)+1)+b;

},

easeInOut:function(t,b,c,d) {

if(t==0)returnb;

if(t==d)returnb+c;

if((t/=d/2)<1)returnc/2*Math.pow(2,10*(t-1))+b;

returnc/2*(-Math.pow(2,-10*--t)+2)+b;

}

},

Circ:{

easeIn:function(t,b,c,d) {

return-c*(Math.sqrt(1-(t/=d)*t)-1)+b;

},

easeOut:function(t,b,c,d) {

returnc*Math.sqrt(1-(t=t/d-1)*t)+b;

},

easeInOut:function(t,b,c,d) {

if((t/=d/2)<1)return-c/2*(Math.sqrt(1-t*t)-1)+b;

returnc/2*(Math.sqrt(1-(t-=2)*t)+1)+b;

}

},

Elastic:{

easeIn:function(t,b,c,d,a,p) {

vars;

if(t==0)returnb;

if((t/=d)==1)returnb+c;

if(typeofp=="undefined") p=d*.3;

if(!a||a

s=p/4;

a=c;

}else{

s=p/(2*Math.PI)*Math.asin(c/a);

}

return-(a*Math.pow(2,10*(t-=1))*Math.sin((t*d-s)*(2*Math.PI)/p))+b;

},

easeOut:function(t,b,c,d,a,p) {

vars;

if(t==0)returnb;

if((t/=d)==1)returnb+c;

if(typeofp=="undefined") p=d*.3;

if(!a||a

a=c;

s=p/4;

}else{

s=p/(2*Math.PI)*Math.asin(c/a);

}

return(a*Math.pow(2,-10*t)*Math.sin((t*d-s)*(2*Math.PI)/p)+c+b);

},

easeInOut:function(t,b,c,d,a,p) {

vars;

if(t==0)returnb;

if((t/=d/2)==2)returnb+c;

if(typeofp=="undefined") p=d*(.3*1.5);

if(!a||a

a=c;

s=p/4;

}else{

s=p/(2*Math.PI)*Math.asin(c/a);

}

if(t<1)return-.5*(a*Math.pow(2,10*(t-=1))*Math.sin((t*d-s)*(2*Math.PI)/p))+b;

returna*Math.pow(2,-10*(t-=1))*Math.sin((t*d-s)*(2*Math.PI)/p )*.5+c+b;

}

},

Back:{

easeIn:function(t,b,c,d,s) {

if(typeofs=="undefined") s=1.70158;

returnc*(t/=d)*t*((s+1)*t-s)+b;

},

easeOut:function(t,b,c,d,s) {

if(typeofs=="undefined") s=1.70158;

returnc*((t=t/d-1)*t*((s+1)*t+s)+1)+b;

},

easeInOut:function(t,b,c,d,s) {

if(typeofs=="undefined") s=1.70158;

if((t/=d/2)<1)returnc/2*(t*t*(((s*=(1.525))+1)*t-s))+b;

returnc/2*((t-=2)*t*(((s*=(1.525))+1)*t+s)+2)+b;

}

},

Bounce:{

easeIn:function(t,b,c,d) {

returnc-Tween.Bounce.easeOut(d-t,0, c, d)+b;

},

easeOut:function(t,b,c,d) {

if((t/=d)<(1/2.75)) {

returnc*(7.5625*t*t)+b;

}elseif(t<(2/2.75)) {

returnc*(7.5625*(t-=(1.5/2.75))*t+.75)+b;

}elseif(t<(2.5/2.75)) {

returnc*(7.5625*(t-=(2.25/2.75))*t+.9375)+b;

}else{

returnc*(7.5625*(t-=(2.625/2.75))*t+.984375)+b;

}

},

easeInOut:function(t,b,c,d) {

if(t

returnTween.Bounce.easeIn(t*2,0, c, d)*.5+b;

}else{

returnTween.Bounce.easeOut(t*2-d,0, c, d)*.5+c*.5+b;

}

}

}

}

Math.tween=Tween;

```

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末慰丛,一起剝皮案震驚了整個(gè)濱河市音羞,隨后出現(xiàn)的幾起案子亏狰,更是在濱河造成了極大的恐慌,老刑警劉巖富纸,帶你破解...
    沈念sama閱讀 212,718評(píng)論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡奏纪,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,683評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門斩启,熙熙樓的掌柜王于貴愁眉苦臉地迎上來序调,“玉大人,你說我怎么就攤上這事兔簇》⒕睿” “怎么了硬耍?”我有些...
    開封第一講書人閱讀 158,207評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)边酒。 經(jīng)常有香客問我经柴,道長(zhǎng),這世上最難降的妖魔是什么墩朦? 我笑而不...
    開封第一講書人閱讀 56,755評(píng)論 1 284
  • 正文 為了忘掉前任坯认,我火速辦了婚禮,結(jié)果婚禮上氓涣,老公的妹妹穿的比我還像新娘牛哺。我一直安慰自己,他們只是感情好春哨,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,862評(píng)論 6 386
  • 文/花漫 我一把揭開白布荆隘。 她就那樣靜靜地躺著,像睡著了一般赴背。 火紅的嫁衣襯著肌膚如雪椰拒。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 50,050評(píng)論 1 291
  • 那天凰荚,我揣著相機(jī)與錄音燃观,去河邊找鬼。 笑死便瑟,一個(gè)胖子當(dāng)著我的面吹牛缆毁,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播到涂,決...
    沈念sama閱讀 39,136評(píng)論 3 410
  • 文/蒼蘭香墨 我猛地睜開眼脊框,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了践啄?” 一聲冷哼從身側(cè)響起浇雹,我...
    開封第一講書人閱讀 37,882評(píng)論 0 268
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎屿讽,沒想到半個(gè)月后昭灵,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,330評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡伐谈,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,651評(píng)論 2 327
  • 正文 我和宋清朗相戀三年烂完,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片诵棵。...
    茶點(diǎn)故事閱讀 38,789評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡抠蚣,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出履澳,到底是詐尸還是另有隱情嘶窄,我是刑警寧澤缓屠,帶...
    沈念sama閱讀 34,477評(píng)論 4 333
  • 正文 年R本政府宣布,位于F島的核電站护侮,受9級(jí)特大地震影響敌完,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜羊初,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,135評(píng)論 3 317
  • 文/蒙蒙 一滨溉、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧长赞,春花似錦晦攒、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,864評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至贩据,卻和暖如春栋操,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背饱亮。 一陣腳步聲響...
    開封第一講書人閱讀 32,099評(píng)論 1 267
  • 我被黑心中介騙來泰國打工矾芙, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人近上。 一個(gè)月前我還...
    沈念sama閱讀 46,598評(píng)論 2 362
  • 正文 我出身青樓剔宪,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國和親壹无。 傳聞我的和親對(duì)象是個(gè)殘疾皇子葱绒,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,697評(píng)論 2 351

推薦閱讀更多精彩內(nèi)容