旋涡穿梭动画
代码语言:html
所属分类:其他
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> #codevember 01 - infinity: mobius tunnel</title>
<style>
html, body {
overflow: hidden;
background-color: black;
}
#codepen-link {
position: absolute;
top: 20px;
right: 30px;
height: 40px;
width: 40px;
z-index: 10;
border-radius: 50%;
box-sizing: border-box;
background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/544318/logo.jpg");
background-position: center center;
background-size: cover;
opacity: 0.4;
transition: all 0.25s;
}
#codepen-link:hover {
opacity: 0.8;
box-shadow: 0 0 6px #efefef;
}
</style>
</head>
<body translate="no">
<script>
"use strict";
const { PI, cos, sin, abs } = Math;
const HALF_PI = 0.5 * PI;
const TAU = 2 * PI;
const TO_RAD = PI / 180;
const fadeInOut = (t, m) => {
let hm = 0.5 * m;
return abs((t + hm) % m - hm) / hm;
};
let canvas;
let ctx;
let circles;
let origin;
.........完整代码请登录后点击上方下载按钮下载查看
网友评论0