//AdSenseにリンク

クリックして、2秒かけて450度回転してから3枚の画像がランダムに差し替わり、1080度回転して止まる書き方を教えてください

初期の画像1
<div>
  <img id="myImage" src="初期の画像1.jpg" alt="初期の画像1">
</div>

<script>
  // 画像要素を取得します
  var image = document.getElementById("myImage");

  // 画像のパスの配列を作成します
  var imagePaths = [
    "新しい画像1.jpg",
    "新しい画像2.jpg",
    "新しい画像3.jpg"
  ];

  // クリックイベントの処理を定義します
  function handleClick() {
    // 画像を回転させるアニメーションを設定します
    image.style.transition = "transform 2s";
    image.style.transform = "rotate(450deg)";

    // 2秒後に画像を差し替えてさらに回転させるアニメーションを設定します
    setTimeout(function() {
      // ランダムな画像のインデックスを選択します
      var randomIndex = Math.floor(Math.random() * imagePaths.length);
      // 新しい画像のパスを取得します
      var newImagePath = imagePaths[randomIndex];
      // 画像を差し替えます
      image.src = newImagePath;
      image.alt = "新しい画像";
      image.style.transform = "rotate(1080deg)";
    }, 2000);
  }

  // クリックイベントのリスナーを追加します
  image.addEventListener("click", handleClick);
// 画像のパスの配列を作成します
var imagePaths = [
  "新しい画像1.jpg",
  "新しい画像2.jpg",
  "新しい画像3.jpg"
];
// ランダムな画像のインデックスを選択します
var randomIndex = Math.floor(Math.random() * imagePaths.length);
// 新しい画像のパスを取得します
var newImagePath = imagePaths[randomIndex];
</script>