js实现canvas彩色粒子线条跟随鼠标运动动画效果代码

代码语言:html

所属分类:粒子

代码描述:js实现canvas彩色粒子线条跟随鼠标运动动画效果代码

代码标签: canvas 粒子 线条

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <style>
        body {
          background-color:#000;
        }
        
        body, html, #container {
        				width:100%;
        				height:100%;
        				margin:0;
            padding:0;
        }
        
        #description {
          position:absolute;
          /*padding:8px;
          border-radius:8px;
          background-color:rgba(255,255,255,0.5);
          margin:8px;
          width:400px;*/
          color:#fff;
        }
        
        h1, p {
          margin:5px;
        }
    </style>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
</head>

<body>
    <div id="description">
        <p>移动鼠标 ^^ 单击以进行 3D 旋转.</p>
    </div>
    <div id="container"><canvas id="canvas" ></canvas></div>
    <script>
        var KL = KL || {};
        
        KL.Particle = function(x, y, z, color, gV) {
        
        	this.v = new KL.V3(x, y, z);
        	this.oldV = new KL.V3(x, y, z);
        	this.gV = gV || null;
        	this.color = color || new KL.color();
        	this.velocity = new KL.V3();
        	this.length = 0;
        
        	this.move = function () {
        		//var v0 = ;
        		//this.velocit.........完整代码请登录后点击上方下载按钮下载查看

网友评论0