canvas实现一个蜘蛛南瓜头燃烧动画效果代码-html代码-BFW代码库

canvas实现一个蜘蛛南瓜头燃烧动画效果代码

代码语言：html

所属分类：动画

代码描述：canvas实现一个蜘蛛南瓜头燃烧动画效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">


    <style>
        * {
          margin: 0;
          box-sizing: border-box;
          overflow: hidden;
        }
        
        body {
          background: #272829;
          width: 100%;
          height: 100vh;
          display: flex;
          justify-content: center;
          align-items: center;
        }
        body canvas {
          border: none;
          outline: none;
        }
    </style>


</head>

<body>
    <canvas id="canvas"></canvas>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/processing.min.js"></script>


    <script>
     var sketchProc = function(processingInstance) {
  with (processingInstance) {
    size(600, 600); 
    frameRate(60);    
    smooth();
    
    var headColor = color(218, 89, 24, 210);
    var outlineColor = color(159, 67, 20);
    var mouthColor = color(244, 238, 43, 200);
    var mouthShadowColor = color(224, 131, 45);
    var eyeColor = color(244, 238, 43, 200);
    var eyeShadowColor = color(148, 61, 10);
    var stalkColor = color(28, 99, 10, 200);
    var backgroundColor = color(39, 40, 41);
    var webColor = color(255, 255, 255, 50);
    var spiderColor = color(0);
    var spiderStripeColor = color(201, 26, 26, 200);
    var particleColor = color(230, 62, 28, 50);

    var xOffset = -40;
    var yOffset = 60;

    var spiderYOffset = 0;
    var yDir = 1;

    //Particle object
    var Particle = function(position, acceleration, timeToLive, c, size) {
        this.acceleration = acceleration;
        this.velocity = new PVector(random(-1, 1), random(-1, 1));
        this.position = position.get();
        this.timeToLive = timeToLive;
        this.color = c;
        this.size = size;
    };

    //Run the particle
    Particle.prototype.run = function() {
        this.update();
        this.display();
    };

    //Update the particle
    Part.........完整代码请登录后点击上方下载按钮下载查看