Make a game that is good's game

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

No:24957

←

Prev Next

→

Make a game that is good
Developer User12039｜Date and time 23/11/15 4:27:27
Build time 133.905 sec｜Game capacity 4.001KB｜

Script

Sure, I can help you create a simple game using HTML, JavaScript, and pictograms. Here's an example of how you can implement a basic game where the player needs to catch falling objects using a smartphone:

Score: 0

In this game, the player controls a pictogram character using touch input on their smartphone. The goal is to catch falling pictogram objects by moving the player horizontally. Each caught object increases the score. The game ends when an object reaches the bottom of the game container. To run the game, save the code above into a single HTML file and open it on a smartphone browser. Make sure to replace the filenames in the CSS with the actual pictogram images you want to use. You can also modify the game configuration parameters at the top of the script to change the game behavior. This is a simple example game, but you can enhance and customize it further based on your requirements and preferences.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Falling Objects Game</title>
  <style>
    body {
      background-color: #f3f3f3;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      margin: 0;
      font-family: Arial, sans-serif;
    }

#game-container {
      position: relative;
      width: 300px;
      height: 400px;
      border: 1px solid #ccc;
      border-radius: 5px;
      overflow: hidden;
    }

.object {
      position: absolute;
      width: 50px;
      height: 50px;
    }

.player {
      background-image: url('pictogram_player.png');
      background-size: cover;
    }

.falling-object {
      background-image: url('pictogram_object.png');
      background-size: cover;
    }

#score {
      text-align: center;
      font-size: 20px;
      margin-top: 10px;
    }
  </style>
</head>
<body>
<div id="game-container">
  <div id="score">Score: 0</div>
</div>

// Game state
  let playerX = (gameContainer.offsetWidth - playerSize) / 2;
  let objects = [];
  let score = 0;

// Create player
  const player = document.createElement("div");
  player.classList.add("object", "player");
  gameContainer.appendChild(player);

// Handle player movement on touch
  gameContainer.addEventListener("touchmove", (event) => {
    event.preventDefault();
    playerX = event.touches[0].clientX - (playerSize / 2);
  });

// Game loop
  function gameLoop() {
    // Update player position
    player.style.left = `${playerX}px`;

// Create new objects if necessary
    if (objects.length < maxObjects) {
      const newObject = document.createElement("div");
      newObject.classList.add("object", "falling-object");
      newObject.style.left = `${Math.random() * (gameContainer.offsetWidth - objectSize)}px`;
      objects.push(newObject);
      gameContainer.appendChild(newObject);
    }

// Update existing objects and check for collisions
    objects.forEach((object, index) => {
      const objectY = parseFloat(object.style.top) || 0;
      object.style.top = `${objectY + objectSpeed}px`;

// Check collision with player
      if (
        objectY + objectSize >= gameContainer.offsetHeight - playerSize &&
        objectY <= gameContainer.offsetHeight &&
        playerX + playerSize >= parseFloat(object.style.left) &&
        playerX <= parseFloat(object.style.left) + objectSize
      ) {
        score += 10;
        document.getElementById("score").textContent = `Score: ${score}`;
        gameContainer.removeChild(object);
        objects.splice(index, 1);
      }
    });

// Remove objects that are out of bounds
    objects = objects.filter((object) => parseFloat(object.style.top) <= gameContainer.offsetHeight);

requestAnimationFrame(gameLoop);
  }

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

To run the game, save the code above into a single HTML file and open it on a smartphone browser. Make sure to replace the filenames in the CSS with the actual pictogram images you want to use. You can also modify the game configuration parameters at the top of the script to change the game behavior.

This is a simple example game, but you can enhance and customize it further based on your requirements and preferences.