A game where we are cubes that we walk and we have to pass through various obstacles and we have to press our finger on the phone to start the game, there should be an animation at the start button The cube keeps moving, if you press it on the phone for a long time, it automatically jumps to what is in your hand's game

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

No:32064

118

←

Prev Next

→

A game where we are cubes that we walk and we have..ALL
Developer User15294｜Date and time 23/12/29 18:35:25
Build time 42.145 sec｜Game capacity 5.366KB｜

Script

Sure! Here's an example of a game where the player controls a cube-shaped character using touch input on a smartphone. The goal is to pass through various obstacles by tapping and holding on the screen to make the cube jump.

Tap and hold to start

You can save the above code in a file with a .html extension and open it in a web browser to play the game. The cube character will automatically start moving, and you can tap and hold on the screen to make it jump and avoid the obstacles. Note: This is a basic implementation and does not include advanced features such as scorekeeping or level progression. Feel free to enhance the game as per your requirements.

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Cube Game</title>
  <style>
    #gameContainer {
      position: relative;
      width: 100%;
      height: 100vh;
      background-color: #f2f2f2;
      overflow: hidden;
    }

#player {
      position: absolute;
      left: 50%;
      bottom: 0;
      transform: translateX(-50%) translateY(calc(-100% - 2rem));
      width: 2rem;
      height: 2rem;
      background-color: red;
    }

.obstacle {
      position: absolute;
      width: 4rem;
      height: 1rem;
      background-color: black;
      bottom: calc(100% + 1rem);
    }

.instruction {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: 2rem;
      font-weight: bold;
    }

.startButton {
      display: inline-block;
      padding: 0.5rem 1rem;
      background-color: green;
      color: white;
      font-weight: bold;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div id="gameContainer">
    <div id="player"></div>
    <div class="obstacle" style="left: 30%;"></div>
    <div class="obstacle" style="left: 65%;"></div>
    <div class="instruction">
      <div class="startButton">Tap and hold to start</div>
    </div>
  </div>

function isColliding() {
        const playerRect = player.getBoundingClientRect();
        return obstacles.some((obstacle) => {
          const obstacleRect = obstacle.getBoundingClientRect();
          return (
            playerRect.left <= obstacleRect.right &&
            playerRect.right >= obstacleRect.left &&
            playerRect.top <= obstacleRect.bottom &&
            playerRect.bottom >= obstacleRect.top
          );
        });
      }

startButton.addEventListener('mousedown', () => {
        jump();
      });

startButton.addEventListener('touchstart', () => {
        jump();
      });

document.addEventListener('contextmenu', (event) => {
        event.preventDefault();
      });

document.addEventListener('keydown', (event) => {
        if (event.code === 'Space') {
          event.preventDefault();
          jump();
        }
      });

document.addEventListener('touchend', (event) => {
        if (event.touches.length === 0) {
          fall();
        }
      });

gameContainer.addEventListener('touchstart', (event) => {
        event.preventDefault();
      });

gameContainer.addEventListener('touchmove', (event) => {
        event.preventDefault();
      });

gameContainer.addEventListener('touchend', () => {
        fall();
      });

gameContainer.addEventListener('mousedown', () => {
        jump();
      });

gameContainer.addEventListener('mousemove', (event) => {
        event.preventDefault();
      });

gameContainer.addEventListener('mouseup', () => {
        fall();
      });
    });
  </script>
</body>
</html>
```

Note: This is a basic implementation and does not include advanced features such as scorekeeping or level progression. Feel free to enhance the game as per your requirements.