AI game creator

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

No:29106

←

Prev Next

→

Boy jump over toys
Developer User9117｜Date and time 23/12/16 2:38:03
Build time 33.029 sec｜Game capacity 3.243KB｜

Script

Sure! Here's a simple game where a boy jumps over toys. It is implemented as a single HTML file and enclosed in script tags. You can play the game on a smartphone using pictograms. Note that this is a very basic example and there's room for improvement and enhancement.

To play the game, open a new HTML file and insert the provided code. Make sure to save the file with a .html extension. Then, you can load the file on any smartphone web browser, and the game will start automatically. The boy can be controlled by tapping on the left half of the screen to move left, and the right half to move right. The goal is to avoid colliding with the red toys as they appear. The game will end if a collision occurs, and you will be shown your final score in an alert message.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Boy Jumping Over Toys</title>
  <style>
    #boy {
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      height: 100px;
      width: 100px;
      background-color: blue;
    }

.toy {
      position: absolute;
      height: 50px;
      width: 50px;
      background-color: red;
    }
  </style>
</head>
<body>
  <div id="boy"></div>
</body>
<script>
  // Game variables
  var boy = document.getElementById('boy');
  var toys = [];
  var timer;
  var score = 0;

// Add toy at random position
  function addToy() {
    var toy = document.createElement('div');
    toy.className = 'toy';
    toy.style.left = Math.random() * (window.innerWidth - 50) + 'px';
    document.body.appendChild(toy);
    toys.push(toy);
  }

// Move boy left or right
  function moveBoy(direction) {
    var leftPosition = parseInt(window.getComputedStyle(boy).getPropertyValue('left'));
    if (direction === 'left') {
      if (leftPosition > 0) {
        boy.style.left = leftPosition - 20 + 'px';
      }
    } else if (direction === 'right') {
      if (leftPosition < window.innerWidth - 100) {
        boy.style.left = leftPosition + 20 + 'px';
      }
    }
  }

// Check collision between boy and toys
  function checkCollision() {
    var boyRect = boy.getBoundingClientRect();
    for (var i = 0; i < toys.length; i++) {
      var toyRect = toys[i].getBoundingClientRect();
      if (
        boyRect.top < toyRect.bottom &&
        boyRect.right > toyRect.left &&
        boyRect.left < toyRect.right
      ) {
        gameOver();
        return;
      }
    }
    score++;
  }

// Game over logic
  function gameOver() {
    clearInterval(timer);
    alert('Game Over! Your score is: ' + score);
    boy.style.display = 'none';
    toys.forEach(function(toy) {
      toy.style.display = 'none';
    });
  }

// Start game
  function startGame() {
    timer = setInterval(function() {
      moveBoy('right');
      checkCollision();
      // Add toy every 1.5 seconds
      if (Math.random() < 0.03) {
        addToy();
      }
    }, 1500);

// Move boy left on touch
    document.addEventListener('touchstart', function(e) {
      var touchX = e.touches[0].clientX;
      var screenWidth = window.innerWidth;
      if (touchX < screenWidth / 2) {
        moveBoy('left');
      } else {
        moveBoy('right');
      }
    });
  }

startGame();
</script>
</html>
```