Игра про подводные лодки и их строительство's game

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

No:25321

←

Prev Next

→

Игра про подводные лодки и их строительство
Developer User12381｜Date and time 23/11/20 15:47:40
Build time 174.957 sec｜Game capacity 3.863KB｜

Script

Здравствуйте! Вот пример игры про подводные лодки и их строительство на основе использования пиктограмм. Ниже приведен код HTML файла, который можно использовать для создания игры. Просто скопируйте его в пустой HTML файл и откройте его в веб-браузере на смартфоне.

Это простая игра, где вы можете перемещать подводную лодку по игровой доске, используя свайпы или касания на смартфоне. Ваша цель - не допустить, чтобы подводная лодка достигла строительной площадки. Если лодка пересекает строительную площадку, игра будет завершена. Удачи в игре!

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Игра про подводные лодки и их строительство</title>
  <style>
    #game-board {
      margin: 20px auto;
      width: 300px;
      height: 300px;
      border: 1px solid black;
      background-color: lightblue;
      position: relative;
    }

.submarine {
      position: absolute;
      width: 50px;
      height: 50px;
      background-color: navy;
      border: 2px solid white;
      border-radius: 50%;
    }

.construction-site {
      position: absolute;
      width: 50px;
      height: 50px;
      background-color: gray;
      border: 2px solid white;
      border-radius: 50%;
    }
  </style>
</head>
<body>
  <div id="game-board">
    <div id="submarine" class="submarine"></div>
    <div id="construction-site" class="construction-site"></div>
  </div>

// Позиция подводной лодки
      let submarineX = 0;
      let submarineY = 0;

// Обработчик события "коснулся"
      gameBoard.addEventListener('touchstart', (event) => {
        const touch = event.touches[0];
      
        // Установка позиции подводной лодки
        submarine.style.left = (touch.pageX - 25) + 'px';
        submarine.style.top = (touch.pageY - 25) + 'px';

submarineX = touch.pageX - 25;
        submarineY = touch.pageY - 25;
      });

// Обработчик события "перетащил"
      gameBoard.addEventListener('touchmove', (event) => {
        const touch = event.touches[0];

// Установка позиции подводной лодки во время перетаскивания
        submarine.style.left = (touch.pageX - 25) + 'px';
        submarine.style.top = (touch.pageY - 25) + 'px';

submarineX = touch.pageX - 25;
        submarineY = touch.pageY - 25;

// Проверка, пересекает ли лодка строительную площадку
        if (
          submarineX >= constructionSite.offsetLeft &&
          submarineX < constructionSite.offsetLeft + 50 &&
          submarineY >= constructionSite.offsetTop &&
          submarineY < constructionSite.offsetTop + 50
        ) {
          // Если лодка пересекает строительную площадку, то игра будет завершена
          alert('Игра окончена! Подводная лодка достигла строительной площадки!');
        }
      });
    });
  </script>
</body>
</html>
```