A game where you tap to bounce from wall to wall, the side you tap on is the side you go to's game

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

No:44184

←

Prev Next

→

A game where you tap to bounce from wall to wall, ..ALL
Developer User19328｜Date and time 24/2/17 7:21:30
Build time 10.733 sec｜Game capacity 3.257KB｜

Script

Sure, here's an example of a simple game implemented as a single HTML file that meets your requirements. It's a game where you tap to make a character bounce from wall to wall, and the side you tap on is the side the character goes to. It uses pictograms for simplicity and assumes smartphone operation.

To play the game, you can open this code in a web browser on your smartphone. When you tap on the left half of the screen, the character will move towards the left wall. When you tap on the right half of the screen, the character will move towards the right wall. Similarly, tapping on the top or bottom half of the screen will make the character move towards the corresponding wall. The character will continuously bounce back and forth between the walls.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Tap Bounce Game</title>
</head>
<body>
  <canvas id="gameCanvas" width="400" height="400"></canvas>

// Create variables for character position and size
      var characterX = 200;
      var characterY = 200;
      var characterSize = 20;
      var characterSpeed = 5;

// Create a variable to track the last tapped side
      var lastTappedSide = "";

function update() {
        // Clear the canvas
        ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw the character
        ctx.fillStyle = "black";
        ctx.fillRect(characterX, characterY, characterSize, characterSize);

// Update character position based on last tapped side
        if (lastTappedSide === "left") {
          characterX -= characterSpeed;
        } else if (lastTappedSide === "right") {
          characterX += characterSpeed;
        } else if (lastTappedSide === "top") {
          characterY -= characterSpeed;
        } else if (lastTappedSide === "bottom") {
          characterY += characterSpeed;
        }

// Check for collision with walls and reverse character movement accordingly
        if (characterX <= 0 || characterX + characterSize >= canvas.width) {
          characterSpeed *= -1;
        }
        if (characterY <= 0 || characterY + characterSize >= canvas.height) {
          characterSpeed *= -1;
        }

// Request next frame update
        requestAnimationFrame(update);
      }

// Handle touch events
      function handleTouch(e) {
        var touchX = e.changedTouches[0].clientX;
        var touchY = e.changedTouches[0].clientY;

if (touchX < canvas.width / 2) {
          // Tapped on left side
          lastTappedSide = "left";
        } else {
          // Tapped on right side
          lastTappedSide = "right";
        }

if (touchY < canvas.height / 2) {
          // Tapped on top side
          lastTappedSide = "top";
        } else {
          // Tapped on bottom side
          lastTappedSide = "bottom";
        }
      }

// Add touch event listener to the canvas
      canvas.addEventListener("touchstart", handleTouch, false);

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