Web Animations API fillありサンプル

.ball {
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #C00;
}

const ball = document.querySelector('.ball');

ball.animate([
  { transform: 'translateX(200px)' },
], {
  duration: 1000,
  fill: 'forwards',
});

元記事を表示する