最近在抖音上流行的黑客帝国入侵效果，今天小编来讲网上的代码详细解释一下。这里先解释一下整体的思想，就是让程序一行一行的循环显示字，但是每显示一行，上一行的透明度就降低，也就是视觉上的变淡，然后再通过随机控制每列显示，然后就形成了黑客帝国入侵的效果。
工具/原料
电脑一台
方法/步骤
1
首先小编这里创建一个txt文件，然后将txt文件后面的后缀名改为html，然后在这个文件中写html以及js代码，下面小编先将全部代码贴出来，然后再依次解释其中的代码。
2
下图代码主要是将整个页面的内边距以及外边距置0，然后让body的背景色为黑色，如下图：
3
然后在body里面放一个图形容器，如下图：
4
下图中的代码主要内容是获取图形容器的画图api，然后设置图形容器的大小，以及设置画图api中字体大小，再初始化每列字符的起始位置为1，如下图：
5
下图中是窗体尺寸变化事件，窗体尺寸变化后，重新计算设置图形容器的尺寸，以及根据图形容器尺寸计算图形容器中存放字体的列数等参数，如下图：
6
下图中就是整个程序的精华所在，draw方法就是画字的方法，执行一次则画一行字，第一次由于所有的drop起始都是1，所以第一次全部显示，但是执行一次全屏之后就会由于draw中的random方法就会使所有列的起始不同，就出现瀑布的效果了，如下图：
7
最后使用setInterval方法让程序每50ms执行一遍draw方法，也就是每50ms画一行字，如下图：
8
最后直接将我们自己写的html文件拖拽到浏览器中进行浏览，就会看到酷炫的黑客帝国入侵的效果了，如下图：
注意事项
1
个人观点，仅供参考。
2
感谢阅读。