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

No:26772

52

Button fun ( there are three buttons, the first bu..ALL
Developer User6472｜Date and time 23/12/2 11:41:07
Build time 54.566 sec｜Game capacity 4.965KB｜

Sure! Here's a single HTML file game that meets your requirements:

Button Fun Game

To play the game, simply save the above code into an HTML file (e.g., `button-fun-game.html`) and open it in your web browser, preferably on a smartphone. You will see the game title, along with three buttons: "Raining Dogs", "Math Questions", and "Bouncing Circles". Each button triggers a different action according to your requirements. Enjoy playing the game!

→ 　

0　

0　

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

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

(C)2023 HisashiApp

Sure! Here's a single HTML file game that meets your requirements:

```html
<!DOCTYPE html>
<html>
<head>
  <title>Button Fun Game</title>
</head>
<body>
  <h1>Button Fun Game</h1>
  
  <button onclick="rainDogs()">Raining Dogs</button>
  <button onclick="solveMathQuestions()">Math Questions</button>
  <button onclick="createBouncingCircles()">Bouncing Circles</button>

<script>
    function rainDogs() {
      // Clear any existing elements
      clearElements();
      
      // Create and display raining dogs
      var rainingDogs = document.createElement("img");
      rainingDogs.src = "https://example.com/dog-image.png";
      rainingDogs.style.position = "fixed";
      rainingDogs.style.top = "0px";
      rainingDogs.style.left = "0px";
      document.body.appendChild(rainingDogs);
      
      // Animate the raining dogs
      var interval = setInterval(function() {
        var currentTop = parseInt(rainingDogs.style.top);
        var nextTop = currentTop + 10;
        rainingDogs.style.top = nextTop + "px";
        
        if (nextTop >= window.innerHeight) {
          clearInterval(interval); // Stop the animation when dogs reach the bottom
          document.body.removeChild(rainingDogs); // Remove the raining dogs
        }
      }, 100);
    }
    
    function solveMathQuestions() {
      // Clear any existing elements
      clearElements();
      
      // Generate 5 random math questions
      var questions = generateMathQuestions(5);
      
      // Display the questions and wait for answers
      var correctAnswers = 0;
      for (var i = 0; i < questions.length; i++) {
        var answer = prompt(questions[i].question);
        
        if (parseInt(answer) === questions[i].answer) {
          correctAnswers++;
        }
      }
      
      // Show the result
      alert("You answered " + correctAnswers + " out of 5 questions correctly!");
    }
    
    function createBouncingCircles() {
      // Clear any existing elements
      clearElements();
      
      // Create and display bouncing circles
      for (var i = 0; i < 5; i++) {
        var circle = document.createElement("div");
        circle.style.width = "50px";
        circle.style.height = "50px";
        circle.style.borderRadius = "50%";
        circle.style.backgroundColor = "red";
        circle.style.position = "absolute";
        
        var randTop = Math.floor(Math.random() * (window.innerHeight - 50));
        var randLeft = Math.floor(Math.random() * (window.innerWidth - 50));
        
        circle.style.top = randTop + "px";
        circle.style.left = randLeft + "px";
        
        document.body.appendChild(circle);
        
        animateCircle(circle);
      }
    }
    
    function animateCircle(circle) {
      var speedX = Math.floor(Math.random() * 4) + 1; // Random X speed between 1 and 4
      var speedY = Math.floor(Math.random() * 4) + 1; // Random Y speed between 1 and 4
      
      var interval = setInterval(function() {
        var currentTop = parseInt(circle.style.top);
        var currentLeft = parseInt(circle.style.left);
        var nextTop = currentTop + speedY;
        var nextLeft = currentLeft + speedX;
        
        if (nextTop <= 0 || nextTop >= (window.innerHeight - 50)) {
          speedY *= -1; // Reverse Y direction when hitting top or bottom
        }
        if (nextLeft <= 0 || nextLeft >= (window.innerWidth - 50)) {
          speedX *= -1; // Reverse X direction when hitting left or right
        }
        
        circle.style.top = nextTop + "px";
        circle.style.left = nextLeft + "px";
      }, 20);
    }
    
    function generateMathQuestions(numQuestions) {
      var questions = [];
      
      for (var i = 0; i < numQuestions; i++) {
        var operand1 = Math.floor(Math.random() * 10) + 1; // Random number between 1 and 10
        var operand2 = Math.floor(Math.random() * 10) + 1; // Random number between 1 and 10
        var operator = Math.random() < 0.5 ? "+" : "-"; // Randomly choose between + and -
        var answer = operator === "+" ? operand1 + operand2 : operand1 - operand2;
        
        questions.push({
          question: operand1 + " " + operator + " " + operand2 + " = ?",
          answer: answer
        });
      }
      
      return questions;
    }
    
    function clearElements() {
      // Remove any existing raining dogs or bouncing circles
      var elements = document.querySelectorAll("img, div");
      for (var i = 0; i < elements.length; i++) {
        document.body.removeChild(elements[i]);
      }
    }
  </script>
</body>
</html>
```

To play the game, simply save the above code into an HTML file (e.g., `button-fun-game.html`) and open it in your web browser, preferably on a smartphone. You will see the game title, along with three buttons: "Raining Dogs", "Math Questions", and "Bouncing Circles". Each button triggers a different action according to your requirements. Enjoy playing the game!