どうスクのアプデを放置した開発者ひさしを絶望的に人生を最悪にするゲー厶

このアプリは、「どうスク」という架空の会社の開発者「ひさし」がアプリのアップデートを放置している状況をモチーフとした、絵文字をクリックして消すゲームです。ゲームが始まると、ランダムなタイミングで絵文字が画面に現れます。プレイヤーはできるだけ多くの絵文字をクリックして消し、10個消せば終了です。スコアはクリックした絵文字の数です。絵文字は絵文字キャラクターのデータを使い、スマートフォンでも遊びやすいようにフォントサイズを大きくしました。ページには1枚のhtmlファイルを使用し、JavaScriptを含んでいます。また、リスタートするための再起動ボタンもあります。

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>どうスクのアプデを放置した開発者ひさしを絶望的に人生を最悪にするゲー厶</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
      #container {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      #game-area {
        width: 80%;
        height: 80%;
        border: 2px solid black;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        font-size: 2em;
        text-align: center;
      }
      #start-btn {
        font-size: 1em;
        margin-top: 20px;
        padding: 10px;
        border: none;
        background-color: lightblue;
        cursor: pointer;
      }
    </style>
  </head>
  <body>
    <div id="container">
      <div id="game-area">
        <h1>どうスクのアプデを放置した開発者ひさしを絶望的に人生を最悪にするゲー厶</h1>
        <button id="start-btn">START</button>
      </div>
    </div>
    <script>
      const gameArea = document.getElementById('game-area');
      const startBtn = document.getElementById('start-btn');
      const emojiArr = ['😠', '💥', '🤯', '😡', '💀', '👿', '🔥', '💢', '👹', '👺'];
      let timer = null;
      let score = 0;
      
      function startGame() {
        timer = setInterval(addEmoji, 1000);
        startBtn.style.display = 'none';
      }
      
      function addEmoji() {
        const randomIndex = Math.floor(Math.random() * emojiArr.length);
        const newEmoji = document.createElement('div');
        newEmoji.innerText = emojiArr[randomIndex];
        newEmoji.style.fontSize = '5em';
        newEmoji.style.position = 'absolute';
        newEmoji.style.top = Math.floor(Math.random() * 70) + '%';
        newEmoji.style.left = Math.floor(Math.random() * 70) + '%';
        newEmoji.addEventListener('click', removeEmoji);
        gameArea.appendChild(newEmoji);
      }
      
      function removeEmoji(event) {
        event.target.remove();
        score++;
        if(score === 10) {
          clearInterval(timer);
          gameArea.innerHTML = `<h2>SCORE: ${score}</h2><button id="start-btn" onclick="location.reload();">RESTART</button>`;
        }
      }
      
      startBtn.addEventListener('click', startGame);
    </script>
  </body>
</html>