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

No:26929

←

Prev Next

→

Roleplay
Developer User13332｜Date and time 23/12/3 8:56:05
Build time 81.994 sec｜Game capacity 3.319KB｜

Script

As an AI language model, I can help you create a simple game using HTML, JavaScript, and pictograms. Here's an example of a game where you have to guess a word by selecting pictograms representing its components. Remember to enclose this code in script tags inside an HTML file to view it properly.

Guess the Word - Pictogram Edition

You can save this code in a file with an `.html` extension, like `game.html`, and open it in a web browser to play the game. When you guess all the pictograms that make up the word, a congratulations message will appear, and then the game will restart with a new word to guess.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <style>
    .pictogram {
      width: 100px;
      height: 100px;
      border: 2px solid black;
      display: inline-block;
      cursor: pointer;
      margin: 5px;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
    }
  </style>
</head>
<body>
  <h1>Guess the Word - Pictogram Edition</h1>
  
  <div id="pictograms">
    <div class="pictogram"></div>
    <div class="pictogram"></div>
    <div class="pictogram"></div>
    <div class="pictogram"></div>
    <div class="pictogram"></div>
  </div>
  
  <h2 id="word-display"></h2>
  
  <script>
    // List of available words and their pictograms
    const words = [
      { word: "apple", pictograms: ["🍏", "🍎", "🌳", "🍃", "🍇"] },
      { word: "banana", pictograms: ["🍌", "🌴", "🍃", "🐒", "🍇"] },
      { word: "cat", pictograms: ["🐱", "🐾", "🐟", "😺", "🌙"] },
      // Add more words and corresponding pictograms here
    ];
    
    let currentWord;
    let guessedLetters = [];
  
    function startGame() {
      const randomIndex = Math.floor(Math.random() * words.length);
      currentWord = words[randomIndex];
      guessedLetters = Array(currentWord.word.length).fill(false);
      displayWord();
      displayPictograms();
    }
  
    function displayWord() {
      const wordDisplay = document.getElementById("word-display");
      wordDisplay.innerHTML = '';
      for (let i = 0; i < currentWord.word.length; i++) {
        const letter = guessedLetters[i] ? currentWord.word[i] : '_';
        wordDisplay.innerHTML += `<span>${letter}</span>`;
      }
    }
  
    function displayPictograms() {
      const pictogramsDiv = document.getElementById("pictograms");
      pictogramsDiv.innerHTML = '';
      for (let i = 0; i < currentWord.pictograms.length; i++) {
        const pictogram = currentWord.pictograms[i];
        const pictogramDiv = document.createElement("div");
        pictogramDiv.classList.add("pictogram");
        pictogramDiv.style.backgroundImage = `url(${pictogram})`;
        pictogramDiv.onclick = () => guessPictogram(i);
        pictogramsDiv.appendChild(pictogramDiv);
      }
    }
  
    function guessPictogram(index) {
      const letter = currentWord.word[index];
      guessedLetters[index] = true;
      displayWord();
      checkForWin();
    }
  
    function checkForWin() {
      if (guessedLetters.every(letter => letter)) {
        setTimeout(() => {
          alert(`Congratulations! You guessed the word "${currentWord.word}"!`);
          startGame();
        }, 500);
      }
    }
    
    // Start the game when the page loads
    window.onload = startGame;
  </script>
</body>
</html>
```