canvas夜晚下暴风雪下雪动画效果代码-html代码-BFW代码库

canvas夜晚下暴风雪下雪动画效果代码

代码语言：html

所属分类：动画

代码描述：canvas夜晚下暴风雪下雪动画效果代码

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

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">



    <style>
        @import url(https://fonts.googleapis.com/css?family=Molle:400italic&subset=latin,latin-ext);
        body{
        background-color: hsla(0,0%,0%,1);
        margin: 0px;
        overflow: hidden;
        font-family: 'Molle', cursive;
        }
        h2{
          left: 50%;
          position: absolute;
          top: 50%;
          transform: translate( -50%, -50%);
          font-size:3em;
          color:hsla(255, 255%, 255%, .1);
        }
    </style>




</head>

<body>
    <canvas id='canv'></canvas>
    <h2>Midnight Snow</h2>


    <script>
        var c = document.getElementById('canv'),
        $ = c.getContext("2d");
        var w = c.width = window.innerWidth,
        h = c.height = window.innerHeight;
        
        Snowy();
        function Snowy() {
          var snow,arr = [];
          var num = 600,tsc = 1,sp = 1;
          var sc = 1.3,t = 0,mv = 20,min = 1;
          for (var i = 0; i < num; ++i) {
            snow = new Flake();
            snow.y = Math.random() * (h + 50);
            snow.x = Math.random() * w;
            snow.t = Math.random() * (Math.PI * 2);
            snow.sz = 100 / (10 + Math.random() * 100) * sc;
            snow.sp = Math.pow(snow.sz * .8, 2) * .15 * sp;
            snow.sp = snow.sp < min ? min : snow.........完整代码请登录后点击上方下载按钮下载查看