Matrix

What is a matrix How do you make a matrix? This script and codes were developed by Stathis Nikolaidis on 03 November 2021, Wednesday.

How do I make an matrix?
  1. Matrix Previews
  2. Matrix HTML Codes
  3. Matrix CSS Codes
  4. Matrix JS Codes
Matrix Previews

Matrix HTML Codes

<!DOCTYPE html>
<html >
<head>
  <meta charset="UTF-8">
  <title>Matrix</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>
  <canvas id="matrix"></canvas>
  
    <script src="js/index.js"></script>

</body>
</html>

Matrix CSS Codes

body{
  background:black;
}

canvas{
  display:block;
}

* {
  margin:0;
  padding:0;
}

Matrix JS Codes

var c = document.getElementById("matrix");
var ctx = c.getContext("2d");

c.height = window.innerHeight;
c.width = window.innerWidth;


var theString = "Stathis Nikolaidis";
theString = theString.split("");

var font_size = 12;
var columns = c.width/font_size;
var drops = [];

for(var x = 0; x < columns; x++)
	drops[x] = 1; 

function draw(){
	
	ctx.fillStyle = "rgba(0, 0, 0, 0.05)";
	ctx.fillRect(0, 0, c.width, c.height);
	
	ctx.fillStyle = "#0F0";
	ctx.font = font_size + "px arial";
	
	for(var i = 0; i < drops.length; i++){
		
		var text = theString[Math.floor(Math.random()*theString.length)];
		
		ctx.fillText(text, i*font_size, drops[i]*font_size);
		
		if(drops[i]*font_size > c.height && Math.random() > 0.975)
			drops[i] = 0;
		
		drops[i]++;
	}
}

setInterval(draw, 30);
Do you want hide your ip address?Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup.