鼠标幽灵跟随粒子效果-html代码-BFW代码库

鼠标幽灵跟随粒子效果

代码语言：html

所属分类：粒子

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">


<style>
@import url(https://fonts.googleapis.com/css?family=Raleway:100);
html, body {
  min-height: 100%;
  height: 100%;
}

body {
  font-family: 'Raleway', sans-serif;
  font-weight: 100;
  color: rgba(255, 255, 255, 0.75);
}

#title {
  position: fixed;
  top: 10px;
  left: 10px;
  font-size: 20px;
  letter-spacing: 0.1em;
  z-index: 100;
}

#sub-title {
  position: fixed;
  top: 35px;
  left: 10px;
  font-size: 14px;
  letter-spacing: 0.1em;
  z-index: 100;
}

#canvas {
  position: absolute;
  left: 0;
  top: 0;
}
</style>

</head>
<body translate="no">
<h1 id="title">Mouse Orbit</h1>
<h2 id="sub-title">Ghost Particle Animation</h2>
<div id="container">
<canvas id="canvas"></canvas>
</div>

<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/lodash.js"></script>
<script>
var PI2 = Math.PI * 2;
var HALF_PI = Math.PI / 2;

var isTouch = 'ontouchstart' in window;
var isSafari = !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/);

function Canvas(options) {
  options = _.clone(options || {});
  this.options = _.defaults(options, this.options);

  this.el = this.options.el;
  this.ctx = this.el.getContext('2d');

  this.dpr = window.devicePixelRatio || 1;

  this.updateDimensions();
  window.addEventListener('resize', this.updateDimensions.bind(this), false);
  this.resetTarg.........完整代码请登录后点击上方下载按钮下载查看