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

No:12947

116

←

Prev Next

→

Rts
Developer User5654｜Date and time 23/8/25 11:13:37
Build time 26.557 sec｜Game capacity 3.436KB｜

Script

Sure, here's a simple game implemented as a single HTML file using JavaScript. The game is designed for smartphone operation and uses pictograms.

Pictogram Game

Score: 0

Tap a pictogram

This game displays three pictograms as div elements. When the player taps on a pictogram, their score increases by 1, and the background image of the selected pictogram is replaced with a new random pictogram image. The game continues indefinitely, and the player can track their score on the screen.

←

Prev　Next

→ 　

Back　

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

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

Sure, here's a simple game implemented as a single HTML file using JavaScript. The game is designed for smartphone operation and uses pictograms.

```html
<!DOCTYPE html>
<html>
<head>
    <title>Pictogram Game</title>
    <style>
        body {
            text-align: center;
        }
        
        #game-container {
            margin-top: 20px;
        }
        
        .pictogram {
            display: inline-block;
            height: 100px;
            width: 100px;
            background-size: cover;
            border: 1px solid black;
            cursor: pointer;
        }
        
        #score {
            margin-top: 20px;
        }
        
        #message {
            margin-top: 10px;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <h1>Pictogram Game</h1>
    <div id="game-container">
        <div class="pictogram" id="picto1"></div>
        <div class="pictogram" id="picto2"></div>
        <div class="pictogram" id="picto3"></div>
    </div>
    <div id="score">Score: <span id="score-counter">0</span></div>
    <div id="message">Tap a pictogram</div>

// Get references to the pictogram elements
        var picto1 = document.getElementById('picto1');
        var picto2 = document.getElementById('picto2');
        var picto3 = document.getElementById('picto3');

// Set the background images of the pictograms randomly
        picto1.style.backgroundImage = 'url(' + getRandomPictogramUrl() + ')';
        picto2.style.backgroundImage = 'url(' + getRandomPictogramUrl() + ')';
        picto3.style.backgroundImage = 'url(' + getRandomPictogramUrl() + ')';
        
        // Add click event listeners to the pictograms
        picto1.addEventListener('click', handleClick);
        picto2.addEventListener('click', handleClick);
        picto3.addEventListener('click', handleClick);

// Function to handle click events on pictograms
        function handleClick(event) {
            var selectedPictogram = event.target;
            incrementScore();
            changePictogram(selectedPictogram);
        }

// Function to increment the score
        function incrementScore() {
            var scoreCounter = document.getElementById('score-counter');
            var score = parseInt(scoreCounter.innerHTML);
            score++;
            scoreCounter.innerHTML = score;
        }

// Function to change the background image of a pictogram
        function changePictogram(selectedPictogram) {
            selectedPictogram.style.backgroundImage = 'url(' + getRandomPictogramUrl() + ')';
        }

// Function to get a random pictogram image URL from the array
        function getRandomPictogramUrl() {
            var randomIndex = Math.floor(Math.random() * pictograms.length);
            return pictograms[randomIndex];
        }
    </script>
</body>
</html>
```