将一个div从底部滑动到另一个带有角度动画的div下面

<div id="slideDiv">要滑动的div</div>
<div id="targetDiv">目标div</div>

#slideDiv {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 200px;
  height: 200px;
  background-color: #f00;
}

#targetDiv {
  position: absolute;
  top: 200px;
  left: 200px;
  width: 200px;
  height: 200px;
  background-color: #00f;
}

@keyframes slideAnimation {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(200px, 200px) rotate(45deg);
  }
}

#slideDiv {
  animation: slideAnimation 1s forwards;
}

window.addEventListener('load', function() {
  var slideDiv = document.getElementById('slideDiv');
  var targetDiv = document.getElementById('targetDiv');
  
  targetDiv.addEventListener('click', function() {
    slideDiv.style.animationPlayState = 'running';
  });
});