AI game creator

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

No:23458

←

Prev Next

→

Shooting Game
Developer User10903｜Date and time 23/10/31 5:11:24
Build time 78.448 sec｜Game capacity 3.955KB｜

Script

Sure! Here's a simple shooting game implemented in a single HTML file, using JavaScript. The game can be played on a smartphone and uses pictograms for visuals. To play the game, tap or click on the screen to shoot down the moving targets.

To play the game, simply save the above code as an HTML file, open it in a web browser on your smartphone, and tap/click on the screen to shoot down the moving targets represented by pictograms. The game ends when all the targets are hit. Have fun!

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <style>
        #game-board {
            position: relative;
            height: 400px;
            width: 100%;
            background-color: #f3f3f3;
        }
        .target {
            position: absolute;
            top: 0;
            height: 50px;
            width: 50px;
            background-color: #ff0000;
        }
        .bullet {
            position: absolute;
            bottom: 0;
            height: 10px;
            width: 5px;
            background-color: #000000;
        }
    </style>
</head>
<body>
    <div id="game-board"></div>

// Create target pictograms
        function createTargets() {
            for (var i = 0; i < 5; i++) {
                var target = document.createElement('div');
                target.classList.add('target');
                target.style.left = Math.random() * (gameBoard.clientWidth - 50) + 'px';
                targets.push(target);
                gameBoard.appendChild(target);
            }
        }

// Create bullet pictogram
        function createBullet(x) {
            var bullet = document.createElement('div');
            bullet.classList.add('bullet');
            bullet.style.left = (x - 2.5) + 'px';
            bullets.push(bullet);
            gameBoard.appendChild(bullet);
        }

// Move targets downwards
        function moveTargets() {
            targets.forEach(function(target) {
                var top = parseFloat(target.style.top) || 0;
                target.style.top = (top + 10) + 'px';

// Check collision with bullets
                bullets.forEach(function(bullet) {
                    var bulletLeft = parseFloat(bullet.style.left);
                    var bulletTop = parseFloat(bullet.style.top) || 400;
                    if (bulletTop < top + 50 && Math.abs(bulletLeft - parseFloat(target.style.left)) < 50) {
                        // Target is hit
                        gameBoard.removeChild(target);
                        targets = targets.filter(function(t) {
                            return t !== target;
                        });
                    }
                });
            });
        }

// Move bullets upwards
        function moveBullets() {
            bullets.forEach(function(bullet) {
                var top = parseFloat(bullet.style.top) || 400;
                bullet.style.top = (top - 10) + 'px';

// Remove bullets that go off screen
                if (top < -10) {
                    gameBoard.removeChild(bullet);
                    bullets = bullets.filter(function(b) {
                        return b !== bullet;
                    });
                }
            });
        }

// Shoot bullets on tap/click
        gameBoard.addEventListener('click', function(e) {
            createBullet(e.clientX);
        });

// Game loop
        function gameLoop() {
            moveTargets();
            moveBullets();
            if (targets.length > 0) {
                requestAnimationFrame(gameLoop);
            } else {
                alert('Congratulations! You won the game!');
            }
        }

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