Click here for free DL of the app version that can save data.

No:17349

136

←

Prev Next

→

A ai image game
Developer User3879｜Date and time 23/9/23 5:56:02
Build time 24.213 sec｜Game capacity 2.223KB｜

Script

Jeu d'image AI

Score: 0

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
<title>Jeu d'image AI</title>
<style>
  body {
    font-family: Arial, sans-serif;
    text-align: center;
  }
  
  h1 {
    margin-top: 50px;
  }
  
  img {
    width: 150px;
  }
  
  .button {
    margin-top: 20px;
    padding: 10px 20px;
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
  }
  
  .score {
    margin-top: 50px;
    font-size: 20px;
  }
  
  .game-over {
    color: red;
    font-weight: bold;
    margin-top: 30px;
    font-size: 24px;
  }
</style>
</head>
<body>
  <h1>Jeu d'image AI</h1>
  <img id="image" src="">
  <div class="score">Score: <span id="score">0</span></div>
  <button class="button" onclick="startGame()">Commencer</button>
  
  <script>
    var images = ["ai1.png", "ai2.png", "ai3.png", "ai4.png", "ai5.png"];
    var score = 0;
    var gameStarted = false;
  
    function startGame() {
      gameStarted = true;
      score = 0;
      document.getElementById("score").innerHTML = score;
      document.getElementById("image").src = getRandomImage();
      document.getElementsByClassName("game-over")[0]?.remove();
    }
  
    function getRandomImage() {
      var randomIndex = Math.floor(Math.random() * images.length);
      return images[randomIndex];
    }
  
    function handleClick() {
      if (gameStarted) {
        score++;
        document.getElementById("score").innerHTML = score;
        document.getElementById("image").src = getRandomImage();
      }
    }
  
    function gameover() {
      gameStarted = false;
      var overMsg = document.createElement("div");
      overMsg.innerHTML = "Jeu terminé. Votre score: " + score;
      overMsg.className = "game-over";
      document.body.appendChild(overMsg);
    }
  
    document.getElementById("image").addEventListener("click", handleClick);
    document.getElementById("image").addEventListener("touchstart", handleClick);
    document.addEventListener("keydown", function(event) {
      if (event.keyCode === 32) { // Space key
        handleClick();
      }
    });
  
    setInterval(function() {
      if (score >= 10) {
        gameover();
      }
    }, 1000);
  </script>
</body>
</html>