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

No:24834

←

Prev Next

→

Потом самоиспытание
Developer User11804｜Date and time 23/11/12 23:39:35
Build time 89.36 sec｜Game capacity 4.168KB｜

Script

Игра "Угадай пиктограмму"

Очки: 0

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Игра "Угадай пиктограмму"</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
      background-color: #f2f2f2;
    }
    
    h1 {
      color: #333333;
      margin: 30px;
    }
    
    #score {
      color: #666666;
      font-size: 18px;
    }
    
    #gameboard {
      display: flex;
      justify-content: space-around;
      margin-top: 30px;
      flex-wrap: wrap;
    }
    
    .pictogram {
      width: 100px;
      height: 100px;
      background-color: #ffffff;
      border-radius: 5px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 10px;
      cursor: pointer;
      border: 2px solid transparent;
      transition: border-color 0.3s ease;
    }
    
    .pictogram:hover {
      border-color: #333333;
    }
    
    .result {
      margin-top: 30px;
      font-size: 24px;
      font-weight: bold;
    }
    
    .start-button {
      padding: 10px 20px;
      background-color: #333333;
      color: #ffffff;
      font-size: 18px;
      border: none;
      border-radius: 5px;
      cursor: pointer;
      transition: background-color 0.3s ease;
    }
    
    .start-button:hover {
      background-color: #555555;
    }
  </style>
</head>
<body>
  <h1>Игра "Угадай пиктограмму"</h1>
  <div id="score">Очки: 0</div>
  <div id="gameboard"></div>
  <div class="result"></div>
  <button class="start-button">Начать игру</button>

let score = 0;
    let currentPictogram = null;

// Генерация случайного индекса для выбора пиктограммы
    function generateRandomIndex() {
      return Math.floor(Math.random() * pictograms.length);
    }

// Обновление игровой доски с пиктограммами
    function updateGameBoard() {
      const gameboard = document.getElementById('gameboard');
      gameboard.innerHTML = '';

// Создание пиктограммы
      for (let i = 0; i < pictograms.length; i++) {
        const pictogram = document.createElement('div');
        pictogram.className = 'pictogram';
        pictogram.innerText = pictograms[i].emoji;
        pictogram.addEventListener('click', handlePictogramClick);
        gameboard.appendChild(pictogram);
      }
    }

// Обработчик клика на пиктограмму
    function handlePictogramClick(event) {
      const clickedPictogram = event.target;
      const selectedPictogramName = pictograms[currentPictogram].name;

if (clickedPictogram.innerText === selectedPictogramName) {
        score += 1;
        document.getElementById('score').innerText = `Очки: ${score}`;
        document.querySelector('.result').innerText = 'Верно!';
      } else {
        document.querySelector('.result').innerText = 'Неверно!';
      }

setTimeout(() => {
        document.querySelector('.result').innerText = '';
        currentPictogram = generateRandomIndex();
        updateGameBoard();
      }, 1500);
    }

// Инициализация игры
    function startGame() {
      score = 0;
      document.getElementById('score').innerText = `Очки: ${score}`;
      currentPictogram = generateRandomIndex();
      updateGameBoard();
    }

// Начать игру при нажатии кнопки "Начать игру"
    document.querySelector('.start-button').addEventListener('click', startGame);
  </script>
</body>
</html>