js实现canvas橙色方块滑动背景动画效果代码
代码语言:html
所属分类:背景
代码描述:js实现canvas橙色方块滑动背景动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
</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.generateSpeed();
this.radiusA = Streak.generateRadius();
this.radiusB = Streak.generateRadius();
this.y1 = Streak.generateY();
this.x1 = this.direction === 1 ? -canvas.width : canvas.width;
this.cosA = this.direction === 1 ? cosA : cosB;
this.sin.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0