AI game creator

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

No:20534

←

Prev Next

→

Marble run
Developer User9090｜Date and time 23/10/10 4:27:01
Build time 17.122 sec｜Game capacity 3.129KB｜

Script

Sure! Here's an example of a simple Marble Run game implemented as a single HTML file, containing JavaScript code enclosed in script tags:

In this Marble Run game, you control a marble rolling towards a goal at the bottom of the screen. The goal appears as a green rectangle, and you need to guide the marble to reach it. On smartphones, you can touch the left side of the screen to move the marble slightly to the left, or touch the right side of the screen to move it slightly to the right. Once the marble reaches the goal, an alert message will pop up, indicating that you have successfully completed the game. You can then reset the game by clicking "OK" in the alert message. The game will automatically reset to its initial state, allowing you to play again. Please note that this is a simplified version of a Marble Run game and can be further modified and enhanced based on your specific requirements and preferences.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a simple Marble Run game implemented as a single HTML file, containing JavaScript code enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Marble Run</title>
  <style>
    * {
      padding: 0;
      margin: 0;
      box-sizing: border-box;
    }
    canvas {
      display: block;
      background: #000;
      margin: auto;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="600"></canvas>

// Define the size and position of the goal
    const goalWidth = canvas.width / 5;
    const goalHeight = canvas.height / 10;
    const goalX = canvas.width / 2 - goalWidth / 2;
    const goalY = canvas.height - goalHeight;

// Define the size and position of the marble
    let marbleSize = canvas.width / 20;
    let marbleX = canvas.width / 2;
    let marbleY = canvas.height / 20;
    let marbleSpeedY = 2;

// Handle touch events on smartphones
    canvas.addEventListener('touchstart', function(e) {
      const touch = e.touches[0];
      const touchX = touch.clientX;
      if (touchX < canvas.width / 2) {
        marbleX -= marbleSize / 2;
      } else {
        marbleX += marbleSize / 2;
      }
    });

// Main game loop
    function gameLoop() {
      // Clear the canvas
      ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw the goal
      ctx.fillStyle = 'green';
      ctx.fillRect(goalX, goalY, goalWidth, goalHeight);

// Draw the marble
      ctx.fillStyle = 'white';
      ctx.beginPath();
      ctx.arc(marbleX, marbleY, marbleSize / 2, 0, 2 * Math.PI);
      ctx.fill();

// Move the marble downwards
      marbleY += marbleSpeedY;

// Check if the marble reached the goal
      if (marbleY + marbleSize / 2 >= goalY) {
        alert('Congratulations! You reached the goal!');
        resetGame();
      }

// Request the next animation frame
      requestAnimationFrame(gameLoop);
    }

// Reset the game to its initial state
    function resetGame() {
      marbleX = canvas.width / 2;
      marbleY = canvas.height / 20;
      marbleSpeedY = 2;
    }

// Start the game loop
    gameLoop();
  </script>
</body>
</html>
```

Once the marble reaches the goal, an alert message will pop up, indicating that you have successfully completed the game. You can then reset the game by clicking "OK" in the alert message. The game will automatically reset to its initial state, allowing you to play again.

Please note that this is a simplified version of a Marble Run game and can be further modified and enhanced based on your specific requirements and preferences.