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

No:46752

←

Prev Next

→

Soccer
Developer User20230｜Date and time 24/2/25 23:59:01
Build time 7.548 sec｜Game capacity 1.837KB｜

Script

Soccer Game

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

<html>
<head>
    <title>Soccer Game</title>
</head>
<body>
    <h1>Soccer Game</h1>
    <canvas id="gameCanvas" width="800" height="400" style="border:1px solid black;"></canvas>
    <script>
        const canvas = document.getElementById("gameCanvas");
        const ctx = canvas.getContext("2d");

// Draw soccer field
        ctx.fillStyle = "green";
        ctx.fillRect(0, 0, canvas.width, canvas.height);

// Draw soccer ball
        ctx.fillStyle = "white";
        ctx.beginPath();
        ctx.arc(canvas.width / 2, canvas.height / 2, 20, 0, Math.PI * 2);
        ctx.fill();

// Define initial positions for players
        let player1X = 50;
        let player1Y = canvas.height / 2;
        let player2X = canvas.width - 50;
        let player2Y = canvas.height / 2;

// Draw player icons
        function drawPlayers() {
            ctx.fillStyle = "blue";
            ctx.fillRect(player1X, player1Y, 20, 20);

ctx.fillStyle = "red";
            ctx.fillRect(player2X, player2Y, 20, 20);
        }

// Handle player movement
        document.addEventListener("keydown", (event) => {
            if (event.key === "ArrowUp") {
                player1Y -= 10;
            } else if (event.key === "ArrowDown") {
                player1Y += 10;
            } else if (event.key === "w") {
                player2Y -= 10;
            } else if (event.key === "s") {
                player2Y += 10;
            }

drawPlayers();
        });

// Handle ball movement
        function moveBall() {
            // Implement ball movement logic here
        }

// Main game loop
        function gameLoop() {
            drawPlayers();
            moveBall();
        }

setInterval(gameLoop, 1000 / 60); // 60 fps
    </script>
</body>
</html>