微信小程式登入頁動畫 雲層漂浮

2021-09-11 09:26:08 字數 474 閱讀 5839

當我看到這張背景圖的時候,強迫症立馬來了,這雲朵為什麼不動,於是開始了一波折騰。方法特別多,本文主要用2個。

translate3d(1,1,0)

你可以理解為(左右,上下,大小)變化。

rotate3d(1,1,0,45deg)

rotate3d

1.兩朵雲除了大小和初始位置不通,其他都相同。

.cloud 

@keyframes cloud

to }複製**

**如下

@keyframes pic 

15%

36%

50%

68%

85%

100%

}複製**

沒想到keyframes不僅有支援from to還支援百分比,不錯。這裡,只要控制好層級關係、動畫時長、透明度即可實現雲層漂浮。

微信小程式登入頁動畫 雲層漂浮

方法特別多,本文主要用2個。translate3d x,y,z 定義 3d 縮放轉換。rotate3d x,y,z,angle 定義 3d 旋轉。translate3d 1,1,0 你可以理解為 左右,上下,大小 變化。rotate3d 1,1,0,45deg 1.兩朵雲除了大小和初始位置不通,其他...

微信小程式動畫

一 自定義動畫使用步驟 1.建立動畫例項 let animation wx.createanimation duration 900 2.呼叫例項的方法 動畫執行過程 animation.opacity 0.5 scale 1.3,1.3 step opacity 1 scale 1,1 step ...

微信小程式登入流程 微信登入

提高使用者體驗 制定產品策略 token 登入態是個邏輯詞彙,token可以理解為登入態的具象化 資料化,在上面的流程圖中,可以看到token是由開發者伺服器建立的乙個字元,而且需要跟openid和session key相關聯,關聯完成之後開發者伺服器將 token下發到客戶端,客戶端儲存在本地,後...