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

No:42402

116

←

Prev Next

→

Minesweeper with a haunted house theme
Developer User18873｜Date and time 24/2/11 17:05:09
Build time 16.295 sec｜Game capacity 4.934KB｜

Script

Sure! Here's an implementation of Minesweeper with a haunted house theme as a single HTML file:

Minesweeper: Haunted House Edition

Please note that in the code above, the image URLs for the mine and flag icons (`url('emozi_bear.png')` and `url('emozi_chicken.png')`) need to be replaced with the actual URLs of the icons you want to use. To play the game, simply copy the above code into an HTML file (e.g., `minesweeper.html`), open the file in a web browser (preferably on a smartphone), and you will be able to play the Minesweeper game with a haunted house theme.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an implementation of Minesweeper with a haunted house theme as a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Minesweeper: Haunted House Edition</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
      background-color: #181818;
      color: #FFFFFF;
    }
    
    h1 {
      margin-top: 50px;
      font-size: 36px;
    }
    
    #board {
      margin-top: 30px;
      display: inline-block;
      border-collapse: collapse;
    }
    
    td {
      width: 40px;
      height: 40px;
      font-size: 28px;
      text-align: center;
      border: 1px solid black;
      cursor: pointer;
    }
    
    .hidden {
      background-color: #333333;
      color: #333333;
    }
    
    .revealed {
      background-color: #BBBBBB;
      color: #000000;
    }
    
    .mine {
      background-image: url('https://example.com/mine.png');
      background-size: contain;
      background-repeat: no-repeat;
    }
    
    .flag {
      background-image: url('https://example.com/flag.png');
      background-size: contain;
      background-repeat: no-repeat;
    }
  </style>
</head>
<body>
  <h1>Minesweeper: Haunted House Edition</h1>
  
  <table id="board">
    <tr>
      <td class="hidden"></td>
      <td class="hidden"></td>
      <td class="hidden"></td>
    </tr>
    <tr>
      <td class="hidden"></td>
      <td class="hidden"></td>
      <td class="hidden"></td>
    </tr>
    <tr>
      <td class="hidden"></td>
      <td class="hidden"></td>
      <td class="hidden"></td>
    </tr>
  </table>
  
  <script>
    const board = document.getElementById('board');
    const cells = board.getElementsByTagName('td');
    const size = 3;
    const mines = 3;
    let mineLocations = [];

function initializeGame() {
      for (let i = 0; i < cells.length; i++) {
        cells[i].classList.add('hidden');
        cells[i].classList.remove('mine', 'flag', 'revealed');
        cells[i].innerHTML = '';
        cells[i].onclick = () => revealCell(i);
        cells[i].oncontextmenu = (e) => {
          e.preventDefault();
          toggleFlag(cells[i]);
        };
      }

mineLocations = [];
      for (let i = 0; i < mines; i++) {
        let randomCell;
        do {
          randomCell = Math.floor(Math.random() * size * size);
        } while (mineLocations.includes(randomCell));
        mineLocations.push(randomCell);
      }
    }

function showGameWin() {
      alert('Congratulations! You won!');
      initializeGame();
    }

function showGameOver() {
      alert('Game Over! You hit a mine!');
      initializeGame();
    }

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

Please note that in the code above, the image URLs for the mine and flag icons (`url('https://example.com/mine.png')` and `url('https://example.com/flag.png')`) need to be replaced with the actual URLs of the icons you want to use.

To play the game, simply copy the above code into an HTML file (e.g., `minesweeper.html`), open the file in a web browser (preferably on a smartphone), and you will be able to play the Minesweeper game with a haunted house theme.