Make a shooter game for mobile's game

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

No:47145

←

Prev Next

→

Make a shooter game for mobile
Developer User20393｜Date and time 24/2/27 10:08:15
Build time 5.9 sec｜Game capacity 1.832KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="600"></canvas>
    <script>
        const canvas = document.getElementById('gameCanvas');
        const ctx = canvas.getContext('2d');

let playerX = 200;
        let playerY = 550;

let bullets = [];

function drawPlayer() {
            ctx.fillStyle = 'blue';
            ctx.fillRect(playerX, playerY, 20, 40);
        }

function drawBullets() {
            ctx.fillStyle = 'red';
            bullets.forEach(bullet => {
                ctx.fillRect(bullet.x, bullet.y, 5, 10);
            });
        }

function shoot() {
            bullets.push({
                x: playerX + 10,
                y: playerY
            });
        }

document.addEventListener('keydown', (event) => {
            if (event.key === 'ArrowLeft' && playerX > 0) {
                playerX -= 10;
            }

if (event.key === 'ArrowRight' && playerX < canvas.width - 20) {
                playerX += 10;
            }

if (event.key === ' ') {
                shoot();
            }
        });

function draw() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            drawPlayer();
            drawBullets();
        }

function update() {
            updateBullets();
        }

function gameLoop() {
            draw();
            update();
            requestAnimationFrame(gameLoop);
        }

gameLoop();
    </script>
</body>
</html>