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

No:37276

49

All in one game
Developer User16885｜Date and time 24/1/21 0:20:42
Build time 17.379 sec｜Game capacity 4.299KB｜

Sure, I can provide you with a simple game implemented as a single HTML file using JavaScript. The game will be designed for smartphone operation and will utilize pictograms. Here's an example of a simple guessing game:

Guess the Pictogram

Pictogram

To use the pictograms, you would need to create a folder named "pictograms" in the same directory as the HTML file. Place the pictogram images in this folder and update the `pictogramList` array with the file names and corresponding answers. When the game starts, a pictogram image will be displayed, and the player needs to type their guess in the input field and click the "Submit" button. If the guess matches the correct answer, a success message will be shown, and the player can proceed to the next pictogram. If the guess is incorrect, an error message will appear. At the end of the game, the player will receive a completion message with the total number of attempts made. The player can restart the game by clicking the "Play Again" button. Note: This is a basic example, and you can customize and enhance it further based on your specific game requirements.

→ 　

0　

0　

[PR]現在の売れ筋Kindle本ランキング

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

(C)2023 HisashiApp

Sure, I can provide you with a simple game implemented as a single HTML file using JavaScript. The game will be designed for smartphone operation and will utilize pictograms. Here's an example of a simple guessing game:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Guess the Pictogram</title>

<style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }

.game-container {
      margin-top: 20%;
    }

img {
      max-width: 200px;
      height: auto;
      margin-bottom: 20px;
    }

input {
      padding: 10px;
      font-size: 16px;
      margin-bottom: 20px;
      width: 80%;
    }

button {
      padding: 10px 20px;
      font-size: 16px;
      border-radius: 5px;
    }

.message {
      font-size: 18px;
      margin-bottom: 20px;
    }
  </style>
</head>
<body>
  <div class="game-container">
    <h1>Guess the Pictogram</h1>
    <img id="pictogram" src="pictograms/question-mark.png" alt="Pictogram" />
    <br>
    <input type="text" id="guess-input" placeholder="Enter your guess">
    <br>
    <button id="submit-btn">Submit</button>
    <div class="message" id="message"></div>
    <button id="play-again-btn" style="display: none;">Play Again</button>
  </div>

<script>
    // Pictogram data
    const pictogramList = [
      { image: 'pictograms/apple.png', answer: 'apple' },
      { image: 'pictograms/car.png', answer: 'car' },
      { image: 'pictograms/book.png', answer: 'book' },
      // Add more pictograms here...
    ];

let currentPictogramIdx = 0;
    let attempts = 0;

const pictogramImg = document.querySelector('#pictogram');
    const guessInput = document.querySelector('#guess-input');
    const submitBtn = document.querySelector('#submit-btn');
    const message = document.querySelector('#message');
    const playAgainBtn = document.querySelector('#play-again-btn');

submitBtn.addEventListener('click', checkGuess);
    playAgainBtn.addEventListener('click', startNewGame);

function startNewGame() {
      currentPictogramIdx = 0;
      attempts = 0;
      submitBtn.disabled = false;
      guessInput.disabled = false;
      guessInput.value = '';
      message.textContent = '';

loadNextPictogram();
      playAgainBtn.style.display = 'none';
    }

function loadNextPictogram() {
      if (currentPictogramIdx < pictogramList.length) {
        pictogramImg.src = pictogramList[currentPictogramIdx].image;
        currentPictogramIdx++;
      } else {
        finishGame();
      }
    }

function checkGuess() {
      const guess = guessInput.value.toLowerCase();
      const answer = pictogramList[currentPictogramIdx - 1].answer;
      attempts++;

if (guess === answer) {
        message.textContent = `Correct! You guessed it in ${attempts} attempt(s).`;
        submitBtn.disabled = true;
        guessInput.disabled = true;
        playAgainBtn.style.display = 'block';
      } else {
        message.textContent = 'Incorrect guess. Try again!';
      }

guessInput.value = '';
    }

function finishGame() {
      pictogramImg.src = 'pictograms/question-mark.png';
      guessInput.disabled = true;
      submitBtn.disabled = true;
      message.textContent = `Congratulations! You have completed the game with ${attempts} total attempt(s).`;
      playAgainBtn.style.display = 'block';
    }

// Start the game
    startNewGame();
  </script>
</body>
</html>
```

To use the pictograms, you would need to create a folder named "pictograms" in the same directory as the HTML file. Place the pictogram images in this folder and update the `pictogramList` array with the file names and corresponding answers.

When the game starts, a pictogram image will be displayed, and the player needs to type their guess in the input field and click the "Submit" button. If the guess matches the correct answer, a success message will be shown, and the player can proceed to the next pictogram. If the guess is incorrect, an error message will appear. At the end of the game, the player will receive a completion message with the total number of attempts made. The player can restart the game by clicking the "Play Again" button.

Note: This is a basic example, and you can customize and enhance it further based on your specific game requirements.