草も燃やすゲーム's game

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

No:32168

←

Prev Next

→

草も燃やすゲーム
Developer うにょUser14145｜Date and time 23/12/30 14:07:09
Build time 15.651 sec｜Game capacity 2.468KB｜

Script

以下は、草を燃やすゲームのサンプルコードです。このコードは1枚のHTMLファイルとして実装されており、JavaScriptを含んでいます。スマホで操作することを前提にしており、絵文字を使っています。

このゲームでは、5x5のフィールド上で、緑色の草をクリックすることで火をつけます。火のついた草は1秒ごとに燃え広がり、周囲の草も燃やすことができます。燃え終わった草は黒く表示されます。このコードをHTMLファイルに保存し、ブラウザで開くことで遊ぶことができます。スマホを操作する際は、緑色の草をタップして火をつけてください。

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>草も燃やすゲーム</title>
  <style>
    #field {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      grid-template-rows: repeat(5, 1fr);
      grid-gap: 10px;
      width: 300px;
      height: 300px;
      margin: 0 auto;
    }

.cell {
      background-color: green;
    }
  </style>
</head>
<body>
  <div id="field"></div>

const cells = [];
    let burningCell = null;

for (let i = 0; i < 25; i++) {
      const cell = document.createElement('div');
      cell.className = 'cell';
      cell.addEventListener('click', () => {
        if (!burningCell) {
          cell.style.backgroundColor = 'red';
          burningCell = cell;
          setTimeout(() => {
            burnGrass(cell);
          }, 1000);
        }
      });
      cells.push(cell);
      field.appendChild(cell);
    }

function burnGrass(cell) {
      cell.style.backgroundColor = 'black';
      const index = cells.indexOf(cell);
      const adjacentCells = getAdjacentCells(index);

adjacentCells.forEach(adjacentCell => {
        if (adjacentCell && adjacentCell.style.backgroundColor !== 'black') {
          adjacentCell.style.backgroundColor = 'red';
          setTimeout(() => {
            burnGrass(adjacentCell);
          }, 1000);
        }
      });

burningCell = null;
    }

function getAdjacentCells(index) {
      const top = cells[index - 5];
      const right = cells[index + 1];
      const bottom = cells[index + 5];
      const left = cells[index - 1];

return [top, right, bottom, left];
    }
  </script>
</body>
</html>
```

このゲームでは、5x5のフィールド上で、緑色の草をクリックすることで火をつけます。火のついた草は1秒ごとに燃え広がり、周囲の草も燃やすことができます。燃え終わった草は黒く表示されます。

このコードをHTMLファイルに保存し、ブラウザで開くことで遊ぶことができます。スマホを操作する際は、緑色の草をタップして火をつけてください。