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

No:38507

Bouncing cube Make sure you don't get the cube on ..ALL
Developer Game Studio｜Date and time 24/1/24 23:58:02
Build time 18.293 sec｜Game capacity 3.994KB｜

Script

Certainly! Here's an example of a simple Bouncing Cube game implemented as a single HTML file using JavaScript:

Bouncing Cube Game

Keep the cube in the air by bouncing it on the stick!

The game consists of a cube and a stick on a game area. The goal is to bounce the cube on the stick without letting it touch the ground. The stick is controlled by the device's orientation (tilting the smartphone). The score increases each time the cube successfully bounces on the stick. If the cube touches the ground, the score resets. Note: This game assumes that the device has orientation support and the `mousemove` event is available. It is important to test it on a smartphone or using a mobile device emulator.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

Certainly! Here's an example of a simple Bouncing Cube game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <style>
    #gameArea {
      width: 100%;
      height: 400px;
      position: relative;
      background-color: #f5f5f5;
      border: 1px solid #ccc;
      margin-top: 20px;
    }
    #cube {
      width: 50px;
      height: 50px;
      position: absolute;
      background-color: #f00;
    }
    #stick {
      width: 100px;
      height: 10px;
      position: absolute;
      background-color: #000;
      bottom: 0;
    }
  </style>
</head>
<body>
  <h1>Bouncing Cube Game</h1>
  <p>Keep the cube in the air by bouncing it on the stick!</p>

// Move the stick
    window.addEventListener('deviceorientation', function(event) {
      var acceleration = event.accelerationIncludingGravity;
      var xAcceleration = acceleration.x;
      var minPos = 0;
      var maxPos = gameArea.width - stick.offsetWidth;
      var xPos = xAcceleration * 10;

if (xPos < minPos) {
        xPos = minPos;
      } else if (xPos > maxPos) {
        xPos = maxPos;
      }
      
      stick.style.left = xPos + 'px';
    });

// Start game
    function startGame() {
      setInterval(moveCube, 10);
    }

// Move the cube
    function moveCube() {
      var topPos = parseInt(cube.style.top) || 0;
      var leftPos = parseInt(cube.style.left) || 0;
      var width = cube.offsetWidth;
      var height = cube.offsetHeight;
      var stickTop = stick.offsetTop;
      var stickBottom = stickTop + stick.offsetHeight;

// Check if cube bounces on stick
      if (leftPos + width >= stick.offsetLeft && leftPos <= stick.offsetLeft + stick.offsetWidth && topPos + height >= stickTop && topPos + height <= stickBottom) {
        score++;
        document.getElementById('score').innerHTML = "Score: " + score;
        cube.style.backgroundColor = getRandomColor();
      }

// Check if cube touches the ground
      if (topPos + height >= gameArea.height) {
        resetScore();
        cube.style.top = (gameArea.height - height) + 'px';
      }
      // Check if cube touches the left or right wall
      if (leftPos <= 0 || leftPos + width >= gameArea.width) {
        cube.style.left = (gameArea.width - width) + 'px';
        cube.style.backgroundColor = getRandomColor();
      }
      // Update cube position
      cube.style.top = (topPos + 1) + 'px';
      cube.style.left = (leftPos + getRandomDirection()) + 'px';
    }

// Reset the score
    function resetScore() {
      score = 0;
      document.getElementById('score').innerHTML = "Score: " + score;
    }

// Generate random color
    function getRandomColor() {
      var letters = '0123456789ABCDEF';
      var color = '#';
      for (var i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
      }
      return color;
    }

// Generate random direction (left or right)
    function getRandomDirection() {
      return Math.random() < 0.5 ? -1 : 1;
    }

// Call the startGame function when the page loads
    window.onload = startGame;
  </script>
</body>
</html>
```

Note: This game assumes that the device has orientation support and the `deviceorientation` event is available. It is important to test it on a smartphone or using a mobile device emulator.