Bouncing circles with for black hole in the center's game

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

No:44812

140

←

Prev Next

→

Bouncing circles with for black hole in the center
Developer User19470｜Date and time 24/2/19 6:31:28
Build time 5.297 sec｜Game capacity 1.666KB｜

Script

Sure! Here is a simple bouncing circles game implemented in a single HTML file with JavaScript enclosed in script tags:

This code will create a simple bouncing circle game where a blue circle bounces around the canvas. You can play the game by opening the HTML file in a web browser.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

Sure! Here is a simple bouncing circles game implemented in a single HTML file with JavaScript enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
<title>Bouncing Circles Game</title>
<style>
    body {
        margin: 0;
        padding: 0;
        overflow: hidden;
    }
    canvas {
        background-color: #f1f1f1;
        display: block;
        margin: auto;
    }
</style>
</head>
<body>
<canvas id="gameCanvas"></canvas>
<script>
    const canvas = document.getElementById('gameCanvas');
    const ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;

const circle = {
        x: canvas.width / 2,
        y: canvas.height / 2,
        radius: 30,
        dx: 5,
        dy: 5
    };

function drawCircle() {
        ctx.beginPath();
        ctx.arc(circle.x, circle.y, circle.radius, 0, Math.PI * 2);
        ctx.fillStyle = 'blue';
        ctx.fill();
        ctx.closePath();
    }

function update() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);

drawCircle();

circle.x += circle.dx;
        circle.y += circle.dy;

if (circle.x + circle.radius > canvas.width || circle.x - circle.radius < 0) {
            circle.dx = -circle.dx;
        }

if (circle.y + circle.radius > canvas.height || circle.y - circle.radius < 0) {
            circle.dy = -circle.dy;
        }

requestAnimationFrame(update);
    }

update();
</script>
</body>
</html>
```

This code will create a simple bouncing circle game where a blue circle bounces around the canvas. You can play the game by opening the HTML file in a web browser.