This website requires JavaScript.
Retoor software development
Source code respository / work
Examples / research / gists
Whoogle
Register
Sign In
const canvas = document.getElementById("matrix"); const ctx = canvas.getContext("2d"); // Make the canvas fill the window canvas.width = window.innerWidth; canvas.height = window.innerHeight; const fontSize = 16; // Size of the characters const columns = Math.floor(canvas.width / fontSize); // Number of columns const drops = Array(columns).fill(0); // Y position of each column const characters = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZあいうえおアイウエオカキクケコ"; // Matrix characters const charArray = characters.split(""); function draw() { // Set a semi-transparent black background to create the fade effect ctx.fillStyle = "rgba(0, 0, 0, 0.05)"; ctx.fillRect(0, 0, canvas.width, canvas.height); ctx.fillStyle = "#0F0"; // Green color for the text ctx.font = `${fontSize}px monospace`; for (let i = 0; i < drops.length; i++) { const char = charArray[Math.floor(Math.random() * charArray.length)]; const x = i * fontSize; const y = drops[i] * fontSize; ctx.fillText(char, x, y); if (y > canvas.height && Math.random() > 0.975) { drops[i] = 0; // Reset the drop } drops[i]++; } } setInterval(draw, 50); // Adjust canvas size on window resize window.addEventListener("resize", () => { canvas.width = window.innerWidth; canvas.height = window.innerHeight; });
9
Commits
1
Branch
0
Tags
7.3
MiB
83b5464f47
Commit Graph
1 Commits
Author
SHA1
Message
Date
retoor
d77de465fc
Modified portfolio site initial commit.
2024-12-06 18:18:45 +00:00