Make a game were there's a spider. You have to move around the spider without getting caught. There are 3 keys to get before you can open the escape door's game

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

No:35923

136

←

Prev Next

→

Make a game were there's a spider. You have to mov..ALL
Developer User16627｜Date and time 24/1/16 3:44:43
Build time 17.408 sec｜Game capacity 4.254KB｜

Script

Sure, here's an example of a simple game where you have to move around a spider without getting caught. The game is implemented as a single HTML file using JavaScript:

In this game, you play as a player represented by a blue square ("pictogram"). Your goal is to move around and collect three keys before reaching the green door to escape. However, you must avoid getting caught by the red spider. You can control the player's movement using the arrow keys on your smartphone or by tapping on the player element. If you get caught by the spider, a game over message will be displayed, and if you collect all three keys and reach the door, a congratulations message will be shown. Please note that this is a basic example and can be further enhanced with additional features, levels, and graphics.

←

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 game where you have to move around a spider without getting caught. The game is implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Spider Game</title>
  <style>
    #player {
      position: absolute;
      width: 50px;
      height: 50px;
      background-color: blue;
    }

#spider {
      position: absolute;
      width: 50px;
      height: 50px;
      background-color: red;
    }

#door {
      position: absolute;
      width: 50px;
      height: 50px;
      background-color: green;
    }
  </style>
</head>
<body>
  <div id="player"></div>
  <div id="spider"></div>
  <div id="door"></div>

let keysCollected = 0;
    let gameOver = false;

// Randomly position the player, spider, and door
    function randomizePositions() {
      const maxWidth = window.innerWidth - 100;
      const maxHeight = window.innerHeight - 100;

const randomX = Math.floor(Math.random() * maxWidth);
      const randomY = Math.floor(Math.random() * maxHeight);

player.style.left = randomX + 'px';
      player.style.top = randomY + 'px';

spider.style.left = randomX + 'px';
      spider.style.top = randomY + 'px';

door.style.left = randomX + 'px';
      door.style.top = randomY + 'px';
    }

// Update the player's position based on the arrow key pressed
    function movePlayer(event) {
      if (gameOver) return;

const playerRect = player.getBoundingClientRect();
      const spiderRect = spider.getBoundingClientRect();

if (playerRect.left < spiderRect.right &&
        playerRect.right > spiderRect.left &&
        playerRect.top < spiderRect.bottom &&
        playerRect.bottom > spiderRect.top) {
        gameOver = true;
        alert('Game over! You got caught by the spider!');
        return;
      }

if (keysCollected === 3) {
        const doorRect = door.getBoundingClientRect();
        if (playerRect.left < doorRect.right &&
          playerRect.right > doorRect.left &&
          playerRect.top < doorRect.bottom &&
          playerRect.bottom > doorRect.top) {
          gameOver = true;
          alert('Congratulations! You escaped through the door!');
          return;
        }
      }

switch (event.key) {
        case 'ArrowUp':
          player.style.top = parseInt(player.style.top) - 10 + 'px';
          break;
        case 'ArrowDown':
          player.style.top = parseInt(player.style.top) + 10 + 'px';
          break;
        case 'ArrowLeft':
          player.style.left = parseInt(player.style.left) - 10 + 'px';
          break;
        case 'ArrowRight':
          player.style.left = parseInt(player.style.left) + 10 + 'px';
          break;
      }
    }

// Collect a key and update the counter
    function collectKey() {
      if (gameOver) return;

keysCollected++;
      alert('Key collected! Keys collected: ' + keysCollected);

if (keysCollected === 3) {
        door.style.backgroundColor = 'orange';
        alert('You gathered all the keys! Find the door to escape!');
      }
    }

// Start the game
    function startGame() {
      randomizePositions();
      document.addEventListener('keydown', movePlayer);
      player.addEventListener('click', collectKey);
    }

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

You can control the player's movement using the arrow keys on your smartphone or by tapping on the player element. If you get caught by the spider, a game over message will be displayed, and if you collect all three keys and reach the door, a congratulations message will be shown.

Please note that this is a basic example and can be further enhanced with additional features, levels, and graphics.