AI game creator

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

No:17889

←

Prev Next

→

Shooter game
Developer User7820｜Date and time 23/9/25 4:18:45
Build time 28.864 sec｜Game capacity 3.109KB｜

Script

Sure! Here's an example of a simple shooter game implemented as a single HTML file, using JavaScript and enclosed in script tags:

In this game, the player (represented by a blue rectangle) can be controlled by touch-based inputs on a smartphone. The player is moved horizontally based on the user's touch position on the screen. There is also a bullet (represented by a red rectangle) that moves upwards. The bullet position is updated on each frame, and when it goes off the canvas, it is reset to the player's position.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

Sure! Here's an example of a simple shooter game implemented as a single HTML file, using JavaScript and enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Shooter Game</title>
    <style>
        canvas { border: 1px solid black; }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Game Canvas and Context
        const canvas = document.getElementById('gameCanvas');
        const ctx = canvas.getContext('2d');

// Player Properties
        const player = {
            x: canvas.width / 2,
            y: canvas.height - 30,
            width: 32,
            height: 32,
            color: 'blue'
        };

// Bullet Properties
        const bullet = {
            x: player.x,
            y: player.y,
            width: 4,
            height: 16,
            color: 'red',
            speed: 4
        };

// Game Loop
        function gameLoop() {
            requestAnimationFrame(gameLoop);
            clearCanvas();  // Clear canvas on each frame
            movePlayer();   // Move player according to input
            drawPlayer();   // Draw player on canvas
            drawBullet();   // Draw bullet on canvas
            updateBullet(); // Update bullet position
        }

// Clear the Canvas
        function clearCanvas() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
        }

// Move the Player
        function movePlayer() {
            // Assuming smartphone operation (touch-based)
            canvas.addEventListener('touchmove', function(event) {
                event.preventDefault();
                player.x = event.targetTouches[0].pageX;
            });
        }

// Draw the Player
        function drawPlayer() {
            ctx.beginPath();
            ctx.rect(player.x - player.width / 2, player.y - player.height / 2, player.width, player.height);
            ctx.fillStyle = player.color;
            ctx.fill();
            ctx.closePath();
        }

// Draw the Bullet
        function drawBullet() {
            ctx.beginPath();
            ctx.rect(bullet.x - bullet.width / 2, bullet.y - bullet.height / 2, bullet.width, bullet.height);
            ctx.fillStyle = bullet.color;
            ctx.fill();
            ctx.closePath();
        }

// Update the Bullet Position
        function updateBullet() {
            bullet.y -= bullet.speed;
            if (bullet.y < 0) bullet.y = player.y;
        }

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