js实现canvas粒子空间穿梭效果代码-html代码-BFW代码库

js实现canvas粒子空间穿梭效果代码

代码语言：html

所属分类：粒子

代码描述：js实现canvas粒子空间穿梭效果代码

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

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

<head>

  <meta charset="UTF-8">

  
  
<style>
body {
  width: 100%;
  margin: 0;
  overflow: hidden;
}
</style>



</head>

<body >
  <canvas id='canv'></canvas>

  
      <script >
var c = document.getElementById('canv');
var $ = c.getContext('2d');
var u = 0;

/*
           Marsaglia's Xorshift128 PRG: http://en.wikipedia.org/wiki/Xorshift
           */
var shift = function (x, y, z, w) {
  x = x || 123456789;
  y = y || 362436069;
  z = z || 521288629;
  w = w || 88675123;

  return function () {
    var s = x ^ x << 11;
    x = y;
    y = z;
    z = w;
    w = w ^ w >>> 19 ^ (s ^ s >>> 8);
    return w;
  };
};

var go = function () {
  var sc,g,g1,i,j,p,x,y,z,w,a,cur,
  d = new Date() / 1000,
  rnd = shift(),
  rnd1 = d,
  rnd2 = 2.4,
  rnd3 = d * 0.2,
  rnd1c = Math.cos(rnd1),
  rnd1s = Math.sin(rnd1),
  rnd2c = Math.cos(rnd2),
  rnd2s = Math.sin(rnd2);

  c.width = window.innerWidth;
  c.height = window.innerHeight;
  sc = Math.max(c.width, c.height);
  $.translate(c.width * 0.5, c.height * 0.5);
  $.scale(sc, sc);

  g = $.createLinearGradient(-1, -2, 1, 2);
  g.addColorStop(0.0, 'hsla(' + u * 5 + ',90%,50%, 1)');
  g.addColorStop(0.5, 'hsla(0,0%,0%,1)');
  g.addColorStop(1.0, 'hsla(' + u + ',90%,50%, 1)');
  $.fillStyle = g;
  $.fillRect(-0.5, -0.5, 1, 1);

  $.rotate(rnd3 % Math.PI * 2);
  for (i = 0; i < 360; i += 1) {

    p = rnd();
    x = (p & 0xff) / 128 - 1;
    y = (p >>> 8 & 0xff) / 128 - 1;
.........完整代码请登录后点击上方下载按钮下载查看