首頁>技術>

老虎機相信大家都玩過,今天我們就使用JavaScript來完成一個超級英雄的老虎機,通過這個案例來學習JavaScript和css的動畫效果

實現的效果

動畫類Animate負責處理動畫物件在指定時間內,以指定速度曲線從A處運動到B處

setInterval() 方法,持續改變方塊的 left 屬性,在限定時間結束時清除定時器。

Tween[function] 計算方塊在每一時刻的位置,並讓方塊在限定時間內到達目的位置。

Game 類處理使用者傳入的引數,呼叫 Animate 例項展現相應的動畫

run 方法處理動畫迴圈,在每次迴圈結束後重置動畫物件

在最後一次迴圈將動畫物件移動到使用者指定的位置,並提供回撥函式

App物件載入和處理來自伺服器的源資料,

例項化 Animate 類並傳入相應的資料,

呼叫 Animate 例項的 run 方法並傳入回撥。

關注麥克黑,原始碼分享。

最新評論
  • BSA-TRITC(10mg/ml) TRITC-BSA 牛血清白蛋白改性標記羅丹明
  • 通俗易懂,微服務實踐kubernetes的健康探測機制