js实现彩色纸屑漫天飞舞动画效果代码-html代码-BFW代码库

js实现彩色纸屑漫天飞舞动画效果代码

代码语言：html

所属分类：动画

代码描述：js实现彩色纸屑漫天飞舞动画效果代码，可通过按钮控制

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

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.4.3.1.min.css">
    <style>
        body{
            background-image:linear-gradient(to top,#a8edea 0,#fed6e3 100%);
        min-height:100vh;
        overflow:hidden
            
        }
        .container{
            margin:150px auto;
            text-align:center
            
        }
    </style>
</head>

<body>
    <div class="container"><button onclick="startConfetti();" class="btn btn-danger">Start</button><button onclick="stopConfetti();" class="btn btn-info">Stop</button><button onclick="toggleConfetti();" class="btn btn-warning">Toggle</button></div>
    <script>
        var maxParticleCount = 150;
 var particleSpeed = 2;
 var startConfetti;
 var stopConfetti;
 var toggleConfetti;
 var removeConfetti;
 (function() {
     startConfetti = g;
     stopConfetti = h;
     toggleConfetti = j;
     removeConfetti = e;
     var b = ["DodgerBlue", "OliveDrab", "Gold", "Pink", "SlateBlue", "LightBlue", "Violet", "PaleGreen", "SteelBlue", "SandyBrown", "Chocolate", "Crimson"];
     var i = false;
     var a = null;
     var d = [];
     var l = 0;

     function f(n, o, m) {
         n.color = b[(Math.random() * b.length) | 0];
         n.x = Math.random() * o;
         n.y = Math.random() * m - m;
         n.diameter = Math.random() * 10 + 5;
         n.tilt = Math.random() * 10 - 10;
         n.tiltAngleIncrement = Math.random() * 0.07000000000000001 + 0.05;
         n.tiltAngle = 0;
         return n
     }

     function g() {
         var q = window.innerWidth;
         var o = window.innerHeight;
         window.requestAnimFrame = (function() {
             return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(r) {
                 return window.setTimeout(r, 16.6666667)
             }
         })();
         var m = document.getElementById("confetti-canvas");
         if (m === null) {
             m = document.cr.........完整代码请登录后点击上方下载按钮下载查看