生成黑客帝國中的代碼雨，效果相當(dāng)?shù)耐廴^程相當(dāng)?shù)暮唵?，不需要電腦額外的安裝工具。
前言
`提示：
有時候需要裝X，高一些看起來很酷炫的特效。見天就帶來一個非?？犰诺拇a雨。
來看看效果：
是不是還可以。然而制作的過程卻十分簡單。
一、使用步驟
1.在桌面新建一個txt文本
截圖如下：
2.代碼
打開txt文本，在文本中在這里插入代碼片寫入下面的代碼。
代碼如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Code</title>
<style>
body{
margin: 0;
overflow: hidden;
}
</style>
</head>
<body>
<canvas id="myCanvas"></canvas>
<script>
const width = document.getElementById("myCanvas").width = screen.availWidth;
const height = document.getElementById("myCanvas").height = screen.availHeight;
const ctx = document.getElementById("myCanvas").getContext("2d");
const arr = Array(Math.ceil(width / 10)).fill(0);
const str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789".split("");
function rain() {
ctx.fillStyle = "rgba(0,0,0,0.05)";
ctx.fillRect(0, 0, width, height);
ctx.fillStyle = "#0f0";
arr.forEach(function (value, index) {
ctx.fillText(str[Math.floor(Math.random() * str.length)], index * 10, value + 10);
arr[index] = value >= height || value > 8888 * Math.random() ? 0 : value + 10;
});
}
setInterval(rain, 30);
</script>
</body>
</html>
截圖如下：
3.最重要的步驟
保存文本，并且關(guān)閉文本。
修改txt文本的名稱和后綴。
文件名改成：
代碼雨.html
改完名以后就有點不一樣了。就像下面這樣，不同的瀏覽器打開，圖標(biāo)會有所不同。
4.運(yùn)行代碼
雙擊圖標(biāo)，代碼自動在瀏覽器中運(yùn)行。生成你想要的結(jié)果。
總結(jié)
提示：這里對文章進(jìn)行總結(jié)：
最重要的2步：
1：把代碼復(fù)制進(jìn)文本
2：把后綴改成html
最后雙擊在瀏覽器打開就可以看到效果了。文章來源：http://www.zghlxwxcb.cn/news/detail-445496.html
一方面：想復(fù)刻一下黑客帝國里的經(jīng)典畫面。
二：正好有時間學(xué)習(xí)一下。文章來源地址http://www.zghlxwxcb.cn/news/detail-445496.html
到了這里，關(guān)于用最簡單的方法生成代碼雨，效果相當(dāng)?shù)耐廴５奈恼戮徒榻B完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
