canvas下雨产生涟漪动画效果代码

代码语言:html

所属分类:动画

代码描述:canvas下雨产生涟漪动画效果代码

代码标签: canvas 下雨 涟漪 动画

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

<!doctype html>
<html>
<head>
    <meta charset="utf-8">


    <style>
        * {
            margin: 0;
            padding: 0;
        }

        canvas {
            background-color: rgba(255,255,255,0.5);
            display: block;
        }
    </style>
</head>
<body>
    <canvas id="canvas">你的浏览器不支持canvas</canvas>
    <script>
        var can = document.getElementById("canvas");
        //设置绘图环境
        var cxt = can.getContext("2d");
        //获取浏览器窗口的宽高
        var w = can.width = window.innerWidth;
        var h = can.height = window.innerHeight;
        //让画布的宽高跟随浏览器窗口的变化而变化
        window.onresize = function () {
            w = can.width = window.innerWidth;
            h = can.height = window.innerHeight;
.........完整代码请登录后点击上方下载按钮下载查看

网友评论0