2016-02-05 154 views
0

我想用左上角的圓圈進行動畫,然後下到畫布的底部並彈跳到右下角。如果你無法想象我的問題,你可以在在Tweenjs(Createjs)中改變具有bounceOut緩動效果的路徑

http://www.createjs.com/demos/tweenjs/tween_sparktable

(第三演示)看到一個例子

我發現,使用動畫輕鬆一個div代碼,但僅此而已。它道出了直線甚至強硬。我改的難易程度影響到bounceOut,這裏是代碼

createjs.Tween.get(gg).to({x:400}, 1000); 
createjs.Ticker.addEventListener("tick", stage); 

http://jsfiddle.net/TeVZ6/

我知道我必須改變「到」功能的路徑,但我不」知道我應該怎麼做才能實現「彎曲,彈跳」路徑

我似乎無法找到關於這一

任何建議的任何教程?

回答

0

你所描述對y位置反彈出輕鬆和緩解x位置。如果你想移動兩個維度,但有不同的容易度,你需要兩個單獨的補間。

@逆的答案是對反彈緩解正確的,但將其更改爲他們y反彈,而是和在x添加第二個放心會給你的效果,我認爲你正在尋找:

createjs.Tween.get(gg).to({x:400}, 1000, createjs.Ease.quadOut); 
createjs.Tween.get(gg).to({y:400}, 1000, createjs.Ease.bounceOut); 

這是updated fiddle

0

您需要在期望的緩和功能通過在Tween.to第三個參數,像這樣:

createjs.Tween.get(gg).to({x:400}, 1000, createjs.Ease.bounceOut);