js实现canvas文字字幕飘动模糊动画效果代码

代码语言:html

所属分类:动画

代码描述:js实现canvas文字字幕飘动模糊动画效果代码

代码标签: 文字 字幕 飘动 模糊 动画 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<html lang="en">
<head>

    <meta charset="UTF-8">





    <style>
        * {
            padding: 0;
            margin: 0;
            overflow: hidden;
            background: #000;
        }
    </style>




</head>

<body>


    <script>
        var w, m, c, C, W, H, r, d, e, i, j, k, s, o, p;
        var a = function () {
            document.
            getElementsByTagName("body")[0].
            appendChild(document.createElement("canvas"));
            w = window;
            m = Math;
            c = document.getElementsByTagName("canvas")[0];
            C = c.getContext("2d");
            c.style.width = '100%';
            c.style.height = '100%';
        };
        var b = function () {
            W = c.width = m.floor(w.innerWidth / 2);
            H = c.height = m.floor(w.innerHeight / 2);
            C.textAlign = 'center';
            C.textBaseline = 'middle';
            C.font = w.innerWidth < 500 ? '40px "impact"': '80px "impact"';
            C.fillStyle = 'black';
            C.fillRect(0, 0, W, H);
            C.fil.........完整代码请登录后点击上方下载按钮下载查看

网友评论0