AI game creator

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

No:50475

←

Prev Next

→

Bouncing Numbers
Developer User21309｜Date and time 24/3/8 16:27:23
Build time 7.483 sec｜Game capacity 1.675KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Bouncing Numbers</title>
    <style>
        #canvas {
            background-color: #f2f2f2;
        }
    </style>
</head>
<body>
    <canvas id="canvas" width="400" height="400"></canvas>
    <script>
        const canvas = document.getElementById('canvas');
        const ctx = canvas.getContext('2d');

const numbers = [];
        for (let i = 0; i < 10; i++) {
            numbers.push({
                x: Math.random() * canvas.width,
                y: Math.random() * canvas.height,
                dx: Math.random() * 2 - 1,
                dy: Math.random() * 2 - 1,
                number: i
            });
        }

function updateNumbers() {
            for (let i = 0; i < numbers.length; i++) {
                numbers[i].x += numbers[i].dx;
                numbers[i].y += numbers[i].dy;

if (numbers[i].x < 0 || numbers[i].x > canvas.width) {
                    numbers[i].dx *= -1;
                }

if (numbers[i].y < 0 || numbers[i].y > canvas.height) {
                    numbers[i].dy *= -1;
                }
            }
        }

function gameLoop() {
            drawNumbers();
            updateNumbers();

requestAnimationFrame(gameLoop);
        }

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