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

No:18977

←

Prev Next

→

Sans fight
Developer User7380｜Date and time 23/10/1 8:44:58
Build time 12.339 sec｜Game capacity 3.863KB｜

Script

Sure! Here is a simple Sans fight game implemented in a single HTML file, using JavaScript and enclosed in script tags. The game is playable and designed for smartphone operation. I have used pictograms to represent the characters and actions. Enjoy playing!

Sans Fight Game

In this game, there are four fight actions represented by pictograms: Attack, Defend, Heal, and Run. Clicking on each action triggers the corresponding JavaScript function. The player and Sans both start with 100 health points. The game randomly calculates damage during each action, and the health points of both the player and Sans are updated accordingly. If either the player's health or Sans' health reaches zero, the game ends with an appropriate message. The current health of the player and Sans is displayed on the game board. Please note that the pictogram icons used in this code are not provided. You can replace the image source URLs in the `<img>` tags with your desired pictogram icons.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Sans Fight Game</title>
  <style>
    body {
      background-color: #000;
      color: #fff;
      font-family: Arial, sans-serif;
      text-align: center;
    }
    
    #game-board {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 80vh;
    }
    
    .fight-action {
      width: 100px;
      height: 100px;
      margin: 10px;
      background-color: #fff;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 50%;
    }
    
    .undertale-icons {
      width: 60px;
      height: 60px;
    }
  </style>
</head>
<body>
  <h1>Sans Fight Game</h1>
  
  <div id="game-board">
    <div id="fight-actions">
      <div class="fight-action" onclick="attackSans()">
        <img class="undertale-icons" src="attack_icon.png" alt="Attack">
      </div>
      <div class="fight-action" onclick="defendPlayer()">
        <img class="undertale-icons" src="defend_icon.png" alt="Defend">
      </div>
      <div class="fight-action" onclick="healPlayer()">
        <img class="undertale-icons" src="heal_icon.png" alt="Heal">
      </div>
      <div class="fight-action" onclick="runAway()">
        <img class="undertale-icons" src="run_icon.png" alt="Run">
      </div>
    </div>
  </div>
  
  <script>
    let playerHealth = 100;
    let sansHealth = 100;
  
    function attackSans() {
      const playerDamage = Math.floor(Math.random() * 10) + 1;
      const sansDamage = Math.floor(Math.random() * 10) + 1;
      
      sansHealth -= playerDamage;
      playerHealth -= sansDamage;
      
      if (playerHealth <= 0) {
        endGame("You Lose! Sans defeated you!");
      } else if (sansHealth <= 0) {
        endGame("You Win! You defeated Sans!");
      } else {
        displayStatus();
      }
    }
  
    function defendPlayer() {
      const sansDamage = Math.floor(Math.random() * 5) + 1;
      
      playerHealth -= sansDamage;
      
      if (playerHealth <= 0) {
        endGame("You Lose! Sans defeated you!");
      } else {
        displayStatus();
      }
    }
  
    function healPlayer() {
      const healthToBeAdded = Math.floor(Math.random() * 10) + 1;
      
      playerHealth += healthToBeAdded;
      
      displayStatus();
    }
  
    function runAway() {
      endGame("You Ran Away! Coward!");
    }
  
    function displayStatus() {
      const playerHealthElement = document.querySelector("#player-health");
      const sansHealthElement = document.querySelector("#sans-health");
      
      playerHealthElement.textContent = playerHealth;
      sansHealthElement.textContent = sansHealth;
    }
  
    function endGame(message) {
      const gameBoardElement = document.querySelector("#game-board");
      gameBoardElement.innerHTML = `<h2>${message}</h2>`;
    }
  
    displayStatus();
  </script>
</body>
</html>
```

Please note that the pictogram icons used in this code are not provided. You can replace the image source URLs in the `<img>` tags with your desired pictogram icons.