drapi.net - Molodetz Institute

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; });

Author	SHA1	Message	Date
retoor	d6ed15e1f6	Example source.	2024-12-16 22:23:13 +01:00