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

No:31592

Mario game with quizzes
Developer User15187｜Date and time 23/12/27 16:48:34
Build time 38.277 sec｜Game capacity 4.256KB｜

Script

Sure! Here's an example of a Mario game with quizzes implemented as a single HTML file:

Mario Quiz Game

Restart

The game displays multiple-choice quiz questions about Mario. The player selects an option by tapping on it, and their score is tracked. After answering all the questions, the final score is displayed, and the player can restart the game. The game is designed for smartphone operation and uses pictograms for options.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

Sure! Here's an example of a Mario game with quizzes implemented as a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Mario Quiz Game</title>
  <style>
    /* CSS styles for better visual presentation */
    body { font-family: Arial, sans-serif; }
    .container { text-align: center; padding-top: 30px; }
    .question { font-size: 20px; margin-bottom: 20px; }
    .options { display: flex; justify-content: center; }
    .option { margin: 10px; padding: 10px 20px; background-color: #f2f2f2; cursor: pointer; }
    .option:hover { background-color: #e6e6e6; }
    .result { font-size: 24px; margin-top: 30px; }
    .restart-btn { background-color: #4CAF50; color: white; padding: 10px 20px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin-top: 30px; cursor: pointer; }
  </style>
</head>
<body>
  <div class="container">
    <h1>Mario Quiz Game</h1>
    <div id="quiz">
      <div class="question"></div>
      <div class="options"></div>
    </div>
    <div class="result"></div>
    <a href="#" class="restart-btn">Restart</a>
  </div>

var currentQuestion = 0;
    var score = 0;
    var container = document.getElementById('quiz');
    var questionEl = document.querySelector('.question');
    var optionsEl = document.querySelector('.options');
    var resultEl = document.querySelector('.result');
    var restartBtn = document.querySelector('.restart-btn');

function displayQuestion() {
      var q = questions[currentQuestion];
      questionEl.textContent = q.question;

optionsEl.innerHTML = '';
      for (var i = 0; i < q.options.length; i++) {
        var option = document.createElement('div');
        option.className = 'option';
        option.textContent = q.options[i];
        option.onclick = checkAnswer;
        optionsEl.appendChild(option);
      }
    }

function checkAnswer(e) {
      var selectedOption = e.target;
      var answer = questions[currentQuestion].answer;
      if (selectedOption.textContent === questions[currentQuestion].options[answer]) {
        // Correct answer
        selectedOption.style.backgroundColor = '#9ACD32';
        score++;
      } else {
        // Wrong answer
        selectedOption.style.backgroundColor = '#FF6347';
      }

// Disable options after answering
      var options = optionsEl.children;
      for (var i = 0; i < options.length; i++) {
        options[i].onclick = null;
      }

// Move to the next question after a short delay
      setTimeout(nextQuestion, 1000);
    }

function nextQuestion() {
      currentQuestion++;
      if (currentQuestion < questions.length) {
        displayQuestion();
      } else {
        showResult();
      }
    }

function showResult() {
      container.style.display = 'none';
      resultEl.textContent = 'You scored ' + score + ' out of ' + questions.length + ' points!';
      resultEl.style.display = 'block';
      restartBtn.style.display = 'inline-block';
    }

function restartQuiz() {
      currentQuestion = 0;
      score = 0;
      resultEl.style.display = 'none';
      restartBtn.style.display = 'none';
      container.style.display = 'block';
      displayQuestion();
    }

// Initial game setup
    restartBtn.onclick = restartQuiz;
    displayQuestion();
  </script>
</body>
</html>
```