p5加载loading光盘效果

代码语言:html

所属分类:加载滚动

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/p5.js"></script>
<style>
html, body {
  margin: 0;
  padding: 0;
  overflow: hidden;
}
</style>

</head>
<body translate="no">



<script >
const BG = '#88ddee';
const COLORS = [
'#d00d33', // red
'#24a2f7', // blue
'#7e7e7e', // grey
'#b14ffa' // purple
];
const N_COLORS = COLORS.length;
const BLACK = '#000';
const WHITE = '#fff';
const RADIUS = 100;
const TWEEN_DURATION = 2000;
const SCALE = 16 / 9 / 1000;

let fps = 0;
let cx, cy, ratio;

// from: https://gist.github.com/gre/1650294
const easeInOutQuad = t => t < .5 ? 2 * t * t : -1 + (4 - 2 * t) * t;

function setup() {
  createCanvas(innerWidth, innerHeight);
  windowResized();
}

function windowResized() {
  ratio = SCALE * min(innerWidth, innerHeight);
  resizeCanvas(innerWidth, innerHeight);
}

function draw() {
  background(BG);

  // calculate va.........完整代码请登录后点击上方下载按钮下载查看

网友评论0