Black background with dots falling from the top going down and slowly changing color and size and little triangles floating around moving slowly in random directions slowly fading away while others are slowly fading into existence's game

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

No:27105

100

←

Prev Next

→

Black background with dots falling from the top go..ALL
Developer User13389｜Date and time 23/12/4 7:57:42
Build time 18.528 sec｜Game capacity 3.41KB｜

Script

Sure! Here's an example of a simple game that meets your requirements:

This HTML file creates a game with a black background. It uses the HTML5 canvas element to draw dots falling from the top of the screen, changing color and size gradually. It also includes little triangles floating around, moving in random directions, and slowly fading away while others are slowly fading into existence. The game runs using a game loop implemented in JavaScript, and it is designed to be played on a smartphone.

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

Sure! Here's an example of a simple game that meets your requirements:

```html
<!DOCTYPE html>
<html>
<head>
<style>
  body {
    background-color: black;
    overflow: hidden;
  }
  canvas {
    position: absolute;
    top: 0;
    left: 0;
  }
</style>
</head>
<body>

var ctx = gameCanvas.getContext("2d");

// Dot class
    function Dot(x, y, size, color) {
      this.x = x;
      this.y = y;
      this.size = size;
      this.color = color;
      this.speed = Math.random() * 2 + 1;

this.update = function() {
        this.y += this.speed;
        ctx.fillStyle = this.color;
        ctx.beginPath();
        ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
        ctx.closePath();
        ctx.fill();
      };
    }

// Triangle class
    function Triangle(x, y, size) {
      this.x = x;
      this.y = y;
      this.size = size;
      this.opacity = 1;
      this.speedX = Math.random() * 2 - 1;
      this.speedY = Math.random() * 2 - 1;

this.update = function() {
        this.x += this.speedX;
        this.y += this.speedY;
        this.opacity -= 0.01;
        ctx.fillStyle = "rgba(255, 255, 255, " + this.opacity + ")";
        ctx.beginPath();
        ctx.moveTo(this.x, this.y);
        ctx.lineTo(this.x - this.size / 2, this.y + this.size);
        ctx.lineTo(this.x + this.size / 2, this.y + this.size);
        ctx.closePath();
        ctx.fill();
      };
    }

// Game loop
    function updateGame() {
      ctx.clearRect(0, 0, gameCanvas.width, gameCanvas.height);

// Create new dots
      if (Math.random() < 0.02) {
        var x = Math.random() * gameCanvas.width;
        var y = 0;
        var size = Math.random() * 3 + 1;
        var color = "#" + Math.floor(Math.random() * 16777215).toString(16);
        var dot = new Dot(x, y, size, color);
        dots.push(dot);
      }

// Update and draw dots
      for (var i = 0; i < dots.length; i++) {
        dots[i].update();
      }

// Create new triangles
      if (Math.random() < 0.01) {
        var x = Math.random() * gameCanvas.width;
        var y = Math.random() * gameCanvas.height;
        var size = Math.random() * 10 + 5;
        var triangle = new Triangle(x, y, size);
        triangles.push(triangle);
      }

// Update and draw triangles
      for (var i = 0; i < triangles.length; i++) {
        triangles[i].update();
        if (triangles[i].opacity <= 0) {
          triangles.splice(i, 1);
          i--;
        }
      }

requestAnimationFrame(updateGame);
    }

// Array to store dots and triangles
    var dots = [];
    var triangles = [];

// Start the game loop
    updateGame();
  }

// Start the game
  startGame();
</script>

</body>
</html>
```