css3怎麼能做到弧形的運動軌跡-PHP中文網路問答

文章專題學習下載問答程式設計字典遊戲最近更新

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

css3怎麼能做到弧形的運動軌跡

扔个三星炸死你 2017-07-01 09:12:22

1909

因為想做花瓣掉落的逼真樣子
現在只是在中間點加上了一個斷點但是運動的非常生硬
怎麼能用css3 keyfames 做出那種弧形的運動軌跡
得到幫助非常感謝

扔个三星炸死你

全部回覆 (3)

三叔2017-07-01 09:14:22 3樓

應該可以，不過需要計算下，變化的參數

點贊+0

新增回覆

某草草2017-07-01 09:14:22 2樓

我做過一個金幣掉落的效果
我的動畫這麼寫的

@keyframes drop 0% transform: translate(0,0) rotate3d(0,1,0,0deg) 33% transform: translate(-20px,245px) rotate3d(0,1,0,-60deg) 66% transform: translate(20px,490px) rotate3d(0,1,0,60deg) 100% transform: translate(0,736px) rotate3d(0,1,0,0deg) @keyframes drop2 0% transform: translate(0,0) rotate3d(1,0,0,0deg) 33% transform: translate(20px,245px) rotate3d(1,0,0,60deg) 66% transform: translate(-20px,490px) rotate3d(1,0,0,-60deg) 100% transform: translate(0,736px) rotate3d(1,0,0,0deg)

點贊+0

新增回覆