Make blue ball that you can move all ways's game

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

No:19831

1645

←

Prev Next

→

Make blue ball that you can move all ways
Developer anonymous｜Date and time 70/1/1 9:21:14
Build time unknown sec｜Game capacity 1.274KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

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

var ballX = canvas.width / 2;
      var ballY = canvas.height / 2;
      var ballRadius = 10;
      var ballColor = "blue";

function drawBall() {
        context.beginPath();
        context.arc(ballX, ballY, ballRadius, 0, Math.PI * 2, false);
        context.fillStyle = ballColor;
        context.fill();
        context.closePath();
      }

function moveBall(event) {
        var rect = canvas.getBoundingClientRect();
        var mouseX = event.clientX - rect.left;
        var mouseY = event.clientY - rect.top;

ballX = mouseX;
        ballY = mouseY;

// Clear canvas before redrawing the ball
        context.clearRect(0, 0, canvas.width, canvas.height);

drawBall();
      }

canvas.addEventListener("mousedown", moveBall);
      canvas.addEventListener("mousemove", function(event) {
        if (event.buttons === 1) {
          moveBall(event);
        }
      });

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