A game with 🤬 all over the screen without disappearing.'s game

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

No:7782

1352

←

Prev Next

→

A game with 🤬 all over the screen without disappea..ALL
Developer どうスクのアプデ早くしろよ！🤬💢｜Date and time 23/7/9 21:00:17
Build time 9.27 sec｜Game capacity 2.438KB｜

Script

以下は、指示された要件に基づいて作成されたゲーム「Angry Face Invasion（怒りの顔の侵略）」のHTMLファイルです。

このプログラムでは、画面に怒りの顔の絵文字（🤬）が表示されます。絵文字は定期的に生成され、クリックすることで消えるようになっています。ゲームボードとして機能するHTML要素は`

`で定義されており、JavaScriptのコードでこの要素内に怒りの顔が追加されます。各怒りの顔はクリックイベントを持っており、クリックするとその顔が消えます。顔が表示されている間にいくつの顔をクリックできるかをゲームとして楽しむことができます。このゲームはスマートフォンでもプレイできます。画面いっぱいの怒りの顔の表示という要件に応えており、JavaScriptを含む一枚のHTMLファイルとして実装されています。

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

以下は、指示された要件に基づいて作成されたゲーム「Angry Face Invasion（怒りの顔の侵略）」のHTMLファイルです。

```html
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>Angry Face Invasion</title>
  <style>
    body {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
      background-color: #000;
    }
    
    #game-board {
      display: flex;
      flex-wrap: wrap;
      width: 320px;
      height: 320px;
      border: 1px solid #fff;
      background-color: #000;
    }
    
    .angry-face {
      width: 80px;
      height: 80px;
      font-size: 60px;
      text-align: center;
      line-height: 80px;
      color: #fff;
      background-color: #f00;
      margin: 10px;
      cursor: pointer;
      transition: background-color 0.3s ease;
    }
    
    .angry-face:hover {
      background-color: #900;
    }
  </style>
</head>
<body>
  <div id="game-board"></div>
  
  <script>
    document.addEventListener('DOMContentLoaded', function() {
      const gameBoard = document.getElementById('game-board');
      
      function createAngryFace() {
        const angryFace = document.createElement('div');
        angryFace.classList.add('angry-face');
        angryFace.textContent = '🤬';
        gameBoard.appendChild(angryFace);
        
        angryFace.addEventListener('click', function() {
          this.style.display = 'none';
        });
      }
      
      setInterval(createAngryFace, 500);
    });
  </script>
</body>
</html>
```

このプログラムでは、画面に怒りの顔の絵文字（🤬）が表示されます。絵文字は定期的に生成され、クリックすることで消えるようになっています。ゲームボードとして機能するHTML要素は`<div id="game-board"></div>`で定義されており、JavaScriptのコードでこの要素内に怒りの顔が追加されます。

各怒りの顔はクリックイベントを持っており、クリックするとその顔が消えます。顔が表示されている間にいくつの顔をクリックできるかをゲームとして楽しむことができます。

このゲームはスマートフォンでもプレイできます。画面いっぱいの怒りの顔の表示という要件に応えており、JavaScriptを含む一枚のHTMLファイルとして実装されています。