A game with primary colours's game

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

No:11863

119

←

Prev Next

→

A game with primary colours
Developer unknown｜Date and time 23/8/12 18:26:57
Build time 26.634 sec｜Game capacity 3.27KB｜

Script

Sure! Here's an example of a simple game implemented as a single HTML file, using JavaScript and primary colors. Since you mentioned smartphone operation and pictograms, I have created a game where you have to guess the color based on its name. Note: This implementation is a basic example and can be expanded or customized further based on your requirements.

Save the above code in an HTML file and open it in any web browser to start playing the game. The game will randomly choose a primary color (red, blue, or yellow) and you need to enter the correct color name in the input box to check your guess. The result will be shown below the color box.

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

Note: This implementation is a basic example and can be expanded or customized further based on your requirements.

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Primary Color Guessing Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }
    
    #game-container {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-top: 100px;
    }
    
    .color-box {
      width: 200px;
      height: 200px;
      margin-bottom: 20px;
      border-radius: 50%;
    }
    
    #result {
      margin-top: 30px;
      font-size: 18px;
      font-weight: bold;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <div class="color-box" id="color"></div>
    <input type="text" id="guess-input" placeholder="Enter color name">
    <button id="check-btn">Check</button>
    <p id="result"></p>
  </div>

const colorBox = document.getElementById("color");
    const guessInput = document.getElementById("guess-input");
    const checkBtn = document.getElementById("check-btn");
    const resultElement = document.getElementById("result");

let currentColor;

// Function to start a new round of the game
    function startNewRound() {
      // Randomly select a color from the primary colors array
      const randomIndex = Math.floor(Math.random() * primaryColors.length);
      currentColor = primaryColors[randomIndex];

// Set the color box background
      colorBox.style.backgroundColor = currentColor.color;

// Clear the previous result and guess input
      resultElement.textContent = "";
      guessInput.value = "";
    }

// Function to handle the check button click event
    function checkColorGuess() {
      const userGuess = guessInput.value.trim();
    
      if (userGuess.toLowerCase() === currentColor.name.toLowerCase()) {
        resultElement.textContent = "Correct!";
        resultElement.style.color = "green";
      } else {
        resultElement.textContent = "Wrong! Try again.";
        resultElement.style.color = "red";
      }
    }

// Start the game by setting up event listeners
    function initGame() {
      startNewRound();
      checkBtn.addEventListener("click", checkColorGuess);
      guessInput.addEventListener("keyup", function(event) {
        if (event.key === 'Enter') {
          checkColorGuess();
        }
      });
    }

// Initialize the game
    initGame();
  </script>
</body>
</html>
```