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

No:22763

←

Prev Next

→

Space
Developer User10484｜Date and time 23/10/24 18:35:20
Build time 49.661 sec｜Game capacity 2.898KB｜

Script

Sure, I can help you create a simple game using JavaScript enclosed in script tags in a single HTML file. Let's create a game where the player needs to guess the name of the pictogram displayed on the screen. Here's an example implementation:

Pictogram Guessing Game

In this example, I assumed you have pictogram images named as "emozi_all/pictogram.png", "emozi_chicken.png", etc. in a folder called "pictograms". You can adjust the code accordingly based on your actual filenames and folder structure. When the game is loaded, it will display the first pictogram image. The player needs to enter their guess in the input field and click the submit button. If the guess matches the current pictogram, it will display a success message and move on to the next pictogram. If the guess is incorrect, it will display an error message. Feel free to add more pictogram names to the `pictograms` array and insert corresponding images in the "pictograms" folder to expand the game.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

```html
<!DOCTYPE html>
<html>
  <head>
    <style>
      body {
        text-align: center;
      }
      img {
        max-width: 200px;
        margin: 10px;
      }
      button {
        padding: 10px 20px;
        margin-top: 20px;
        font-size: 16px;
      }
    </style>
  </head>
  <body>
    <h1>Pictogram Guessing Game</h1>
    <img id="pictogram" src="pictograms/1.png">
    <input type="text" id="guess" placeholder="Enter your guess">
    <button onclick="checkGuess()">Submit</button>

var currentIndex = 0;

function getRandomPictogram() {
        var randomIndex = Math.floor(Math.random() * pictograms.length);
        return pictograms[randomIndex];
      }

function checkGuess() {
        var guessInput = document.getElementById("guess");
        var guess = guessInput.value.trim().toLowerCase();
        var currentPictogram = pictograms[currentIndex];

if (guess === currentPictogram) {
          document.getElementById("result").textContent =
            "Correct! Next pictogram:";
          currentIndex++;
          if (currentIndex >= pictograms.length) {
            currentIndex = 0;
            document.getElementById("result").textContent =
              "You've reached the end! Let's play again.";
          }
        } else {
          document.getElementById("result").textContent = "Incorrect. Try again.";
        }

guessInput.value = "";

var pictogramImage = document.getElementById("pictogram");
        pictogramImage.src = "pictograms/" + currentIndex + ".png";
      }

window.onload = function() {
        var pictogramImage = document.getElementById("pictogram");
        pictogramImage.src = "pictograms/" + currentIndex + ".png";
      };
    </script>
  </body>
</html>
```

In this example, I assumed you have pictogram images named as "1.png", "2.png", etc. in a folder called "pictograms". You can adjust the code accordingly based on your actual filenames and folder structure.

When the game is loaded, it will display the first pictogram image. The player needs to enter their guess in the input field and click the submit button. If the guess matches the current pictogram, it will display a success message and move on to the next pictogram. If the guess is incorrect, it will display an error message.

Feel free to add more pictogram names to the `pictograms` array and insert corresponding images in the "pictograms" folder to expand the game.