为了弹跳，我们可以使用 CSS 属性 top 和 position:absolute 来设置球在具有 position:relative 的区域内的位置。

区域的底部坐标是 field.clientHeight。CSS top 属性指的是球的上边缘。所以它应该从 0 到 field.clientHeight - ball.clientHeight，这是球的上边缘的最终最低位置。

为了获得“弹跳”效果，我们可以在 easeOut 模式下使用 bounce 定时函数。

以下是动画的最终代码

let to = field.clientHeight - ball.clientHeight;

animate({
  duration: 2000,
  timing: makeEaseOut(bounce),
  draw(progress) {
    ball.style.top = to * progress + 'px'
  }
});

在沙盒中打开解决方案。