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

No:9543

←

Prev Next

→

Titanic sinking
Developer User4380｜Date and time 23/7/26 1:07:48
Build time 20.176 sec｜Game capacity 2.421KB｜

Script

Here's an example of a simple mini-game in which the player operates a smartphone to rescue passengers from the sinking Titanic using pictograms. The game is implemented as a single HTML file with JavaScript enclosed in script tags:

Titanic Rescue

Swipe left or right to rescue passengers!

Score: 0

In this game, the player is shown an image of the Titanic and is instructed to swipe left or right on their smartphone screen to rescue or ignore passengers, respectively. The score is displayed at the top, and it increases whenever a passenger is successfully rescued. The JavaScript code handles the swipe events and reacts accordingly. Please note that for the game to fully function, you may need to replace the `emozi_all/game.png` placeholder image with an actual image representation of the Titanic.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Titanic Rescue</title>
  <style>
    body {
      text-align: center;
      font-family: Arial, sans-serif;
    }
    #game-container {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    #score {
      margin-top: 10px;
      font-size: 24px;
      font-weight: bold;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <h1>Titanic Rescue</h1>
    <img id="titanic-img" src="titanic.png" alt="Titanic" width="250" height="250">
    <p>Swipe left or right to rescue passengers!</p>
    <div id="score">Score: 0</div>
  </div>

// Number of passengers saved by the player
    let score = 0;

// Increase score and update the display
    function increaseScore() {
      score++;
      document.getElementById('score').textContent = `Score: ${score}`;
    }

// Event listener for swiping left or right on the smartphone screen
    document.addEventListener('touchstart', handleSwipe);

// Handle swipe events
    function handleSwipe(event) {
      const touch = event.touches[0];
      const threshold = window.innerWidth / 2;
      const swipeLeft = touch.clientX < threshold;
      const swipeRight = touch.clientX >= threshold;

if (swipeLeft) {
        rescuePassenger();
      } else if (swipeRight) {
        ignorePassenger();
      }
    }

// Simulate rescuing a passenger
    function rescuePassenger() {
      increaseScore();
      console.log('Passenger rescued!');
    }

// Simulate ignoring a passenger
    function ignorePassenger() {
      console.log('Passenger ignored!');
    }
  </script>
</body>
</html>
```

Please note that for the game to fully function, you may need to replace the `titanic.png` placeholder image with an actual image representation of the Titanic.