keyframe3.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
elem = display.emoji("🤩", 100, 100)

btn = ui.button("Click me", display.center.x, 540)
btn.action(() => {
  elem.animateKeyframe((anim) => {
    anim.keyframe({ t: 200, easing: Ease.inOutCubic }, (to) => {
      to.x += 760
    })
    anim.keyframe({ t: 200, easing: Ease.inOutCubic }, (to) => {
      to.y += 440
    })
    anim.keyframe({ t: 200, easing: Ease.inOutCubic }, (to) => {
      to.x -= 760
    })
    anim.keyframe({ t: 200, easing: Ease.inOutCubic }, (to) => {
      to.y -= 440
    })
  })
})