javascriptで複数の画像を一定時間で切り替える

スポンサーリンク

じゃんけん画像、グー、チョキ、パーを一定時間で切り替えてループさせる。

使用した画像

<img id="jankenpon" src="jan0.png" width="100" height="100">    
<script>
    let img = ["jan0.png", "jan1.png", "jan2.png"];
    let count = -1;
    picChange(); // 関数を実行
    function picChange() {
      count++;
      // カウントが最大になれば配列を初期値に戻すため「0」を指定する
      if (count == img.length) count = 0;    
      // 画像選択
      document.getElementById("jankenpon").src = img[count];
      // 1秒ごとに実行
      setTimeout("picChange()", 100);
    }
    </script>

参考ブログ
JavaScript|じゃんけんゲームを作ろう【勝負判定・乱数】 | 学んで遊んでジャンケンポン!

コメント

タイトルとURLをコピーしました