canavs黄色方块线条运动背景动画效果代码

代码语言:html

所属分类:动画

代码描述:canavs黄色方块线条运动背景动画效果代码

代码标签: canavs 黄色 方块 线条 运动 背景 动画

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

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

<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
    html, body {
  height: 100%;
  overflow: hidden;
}

canvas {
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
}
</style>

</head>
<body>

<canvas></canvas>

<script >
    console.clear();

const canvas = document.querySelector("canvas");
const context = canvas.getContext("2d");
canvas.height = window.innerHeight * 2;
canvas.width = window.innerWidth * 2;

const deg = 13;
const thetaA = Math.PI * (360 - deg) / 180.0;
const thetaB = Math.PI * deg / 180.0;
const cosA = Math.cos(thetaA);
const sinA = Math.sin(thetaA);
const cosB = Math.cos(thetaB);
const sinB = Math.sin(thetaB);

class Pane {
  constructor() {
    this.direction = Streak.generateDirection();
    this.speed = Streak.generateSpe.........完整代码请登录后点击上方下载按钮下载查看

网友评论0