canvas实现windows98屏幕保护屏保动画效果代码-html代码-BFW代码库

canvas实现windows98屏幕保护屏保动画效果代码

代码语言：html

所属分类：动画

代码描述：canvas实现windows98屏幕保护屏保动画效果代码

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


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

<head>

  <meta charset="UTF-8">

  
  
  
<style>
body {
	position: absolute;
	margin: 0;
	padding: 0;
	background: #111;
	width: 100%;
	height: 100%;
}
#screensaver {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #000;
	pointer-events: none;
}
</style>

</head>

<body  >
  <canvas id="screensaver"></canvas>

  
      <script >
!function () {
  'use strict';

  var run = function () {

    ctx.clearRect(0, 0, canvas.width, canvas.height);

    hue = hue < 360 ? hue + 0.8 : 0;
    ctx.strokeStyle = "hsl(" + Math.floor(hue) + ", 80%, 80%)";

    ctx.lineWidth = 1;

    if (nPoly < 50) poly[nPoly++] = new Poly();

    for (var i = 0; i < nPoly; i++) {
      poly[i].anim();
    }


    requestAnimationFrame(run);

  };

  var Poly = function () {
    this.p = [];
    var space = 0.5;
    var dV = [-space, space, space, -space, -space, space, -space, space];
    var xyP = [1, 1, 2, 2, 1, 3, 3, 1];
    for (var i = 0; i < 4; i++) {
      this.p[i] = {
        dx: 5 * dV[i],
        dy: 5 * dV[i + 4].........完整代码请登录后点击上方下载按钮下载查看