1
<canvas id="canvas" style="background:black" width="620" height="340"></canvas>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
window.onload = function() {
    //获取图形对象
    var canvas = document.getElementById("canvas");
    //获取图形的上下文
    var context = canvas.getContext("2d");
    //获取浏览器屏幕的宽度和高度
    var W = window.innerWidth;
    var H = window.innerHeight;
    //设置canvas的宽度和高度
    canvas.width = W;
    canvas.height = H;
    //每个文字的字体大小
    var fontSize = 15;
    //计算列
    var colunms = Math.floor(W / fontSize);
    //记录每列文字的y轴坐标
    var s = [];
    //给每一个文字初始化一个起始点的位置
    for (var i = 0; i < colunms; i++) {
        s.push(0);
    }
    //运动的文字
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX