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

No:51986

165

←

Prev Next

→

A game where you click a ball and it makes a poppi..ALL
Developer User21734｜Date and time 24/3/17 8:30:33
Build time 4.583 sec｜Game capacity 1.317KB｜

Script

Click and Pop Game

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
<title>Click and Pop Game</title>
</head>
<body>
<h1>Click and Pop Game</h1>
<canvas id="myCanvas" width="300" height="300" style="border:1px solid black;"></canvas>

// Set initial position of the ball
var x = canvas.width / 2;
var y = canvas.height / 2;
var radius = 20;

// Function to draw the ball
function drawBall() {
  ctx.beginPath();
  ctx.arc(x, y, radius, 0, Math.PI * 2);
  ctx.fillStyle = "red";
  ctx.fill();
  ctx.closePath();
}

// Function to handle click event
canvas.addEventListener("click", function(event) {
  var mouseX = event.clientX - canvas.offsetLeft;
  var mouseY = event.clientY - canvas.offsetTop;
  
  if(Math.sqrt(Math.pow(mouseX - x, 2) + Math.pow(mouseY - y, 2)) <= radius) {
    // Play popping sound
    var audio = new Audio('pop.mp3');
    audio.play();
    
    // Teleport the ball to a random position
    x = Math.floor(Math.random() * (canvas.width - 2 * radius)) + radius;
    y = Math.floor(Math.random() * (canvas.height - 2 * radius)) + radius;
    
    // Redraw the ball
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    drawBall();
  }
});

// Initial draw of the ball
drawBall();
</script>
</body>
</html>