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

No:24349

I want this game to be anywhere if you get a times..ALL
Developer User11472｜Date and time 23/11/8 1:02:17
Build time 82.063 sec｜Game capacity 3.995KB｜

Script

Sure! Here's an example of a simple game based on the times table using JavaScript, HTML, and pictograms. This game allows you to practice your multiplication skills while battling a powerful boss character. Remember to save the code in a single HTML file and enclose the JavaScript within script tags.

Times Table Battle

This code will generate a random multiplication question between numbers 1-12. If the answer is correct, the player gains a power-up (represented by pictograms). If the answer is incorrect, the boss character attacks, reducing the player's health. The player's health is represented by the opacity of the character image. Please note that the pictograms (character.png, power-up1.png, power-up2.png, power-up3.png) should be present in the same directory as the HTML file for them to load properly. You can replace them with your custom images or use appropriate placeholders.

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Times Table Battle</title>
  <style>
    body {
      text-align: center;
      font-family: Arial, sans-serif;
      background-color: #f2f2f2;
    }

h1 {
      color: #333333;
    }

#question {
      font-size: 24px;
      margin-top: 40px;
    }

#answer {
      font-size: 20px;
      margin-top: 20px;
    }

#result {
      font-size: 20px;
      font-weight: bold;
      margin-top: 10px;
    }

#character {
      max-width: 200px;
      margin-top: 40px;
      margin-bottom: 20px;
    }

.power-up {
      display: inline-block;
      max-width: 50px;
      margin: 10px;
    }
  </style>
</head>
<body>
  <h1>Times Table Battle</h1>
  <div id="question"></div>
  <input id="answer" type="number" />
  <button onclick="checkAnswer()">Answer</button>
  <div id="result"></div>
  <img id="character" src="character.png" alt="Character">
  <div id="powerUps"></div>

function generateQuestion() {
      var number = Math.floor(Math.random() * 12) + 1;
      var multiplier = Math.floor(Math.random() * 12) + 1;
      currentQuestion = {
        number: number,
        multiplier: multiplier
      };
      document.getElementById("question").innerHTML = number + " x " + multiplier;
    }

function checkAnswer() {
      var userAnswer = parseInt(document.getElementById("answer").value);
      var correctAnswer = currentQuestion.number * currentQuestion.multiplier;

if (userAnswer === correctAnswer) {
        // Correct answer, gain power-up
        var powerUp = Math.floor(Math.random() * 3);

if (powerUp === 0) {
          powerUps.push("power-up1.png");
        } else if (powerUp === 1) {
          powerUps.push("power-up2.png");
        } else {
          powerUps.push("power-up3.png");
        }

document.getElementById("result").innerHTML = "Correct!";
        document.getElementById("result").style.color = "green";
      } else {
        // Wrong answer, battle the boss character
        characterHealth -= 10;
        if (characterHealth < 0) {
          characterHealth = 0;
        }

document.getElementById("result").innerHTML = "Wrong! The boss attacked!";
        document.getElementById("result").style.color = "red";
      }

updateCharacterHealth();
      updatePowerUps();
      generateQuestion();
      document.getElementById("answer").value = "";
    }

function updateCharacterHealth() {
      document.getElementById("character").style.opacity = characterHealth / 100;
    }

function updatePowerUps() {
      var powerUpsDiv = document.getElementById("powerUps");
      powerUpsDiv.innerHTML = "";

for (var i = 0; i < powerUps.length; i++) {
        var img = document.createElement("img");
        img.src = powerUps[i];
        img.alt = "Power-Up";
        img.className = "power-up";
        powerUpsDiv.appendChild(img);
      }
    }

generateQuestion();
  </script>
</body>
</html>
```

Please note that the pictograms (character.png, power-up1.png, power-up2.png, power-up3.png) should be present in the same directory as the HTML file for them to load properly. You can replace them with your custom images or use appropriate placeholders.