gsap实现彩虹云跟随鼠标动画效果代码

代码语言:html

所属分类:动画

代码描述:gsap实现彩虹云跟随鼠标动画效果代码,一团雾气凝结。

代码标签: gsap 彩虹 跟随 鼠标 动画

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

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

<head>
 
<meta charset="UTF-8">
 

 
 
<style>
html
, body, canvas {
 
width:100%;
 
height:100%;
 
margin:0;
 
padding:0;
}

canvas
{
 
position:fixed;
}
</style>

 
</head>

<body >
 
<canvas></canvas>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/gsap.3.10.1.js"></script>
     
<script  >
console.clear()
const c = document.querySelector('canvas')
const ctx = c.getContext('2d')
let cw = c.width = innerWidth
let ch = c.height = innerHeight
const imgs = []
const dust = Array(99)
const m = {x:0, y:0}
let currentIndex = 0
const imgData = ['data:image/png;base64,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', 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAABEBAMAAADOyF68AAAAJFBMVEVHcEz///////////////////////////////////////////8Uel1nAAAADHRSTlMAChMfRzDCiqJcc+CoT0BUAAAEJUlEQVR4AYWVWZajOBOFrVoBIjfwI/21gESlFaR4IB9TUg8b4HBOvjckCzAsgB7Eaw80WkBN3lzfwK4yzjE8259v3IhA0u4YHJEku1cjFQLQqwgDIyD0KgIme10mERQbBm/5c6k2OmzHssf2EhDp5o+cSyv4pRJPRZbxrT1d5NmFEOOp3H7FlHLGqssiuJAKBr55ufLeGI9enL44MUqtXyWcZzzV3oSxOAonSXKEUrkyDGbRSqELM4Yi252Yk8dcWZUnOwY4T6UzZTDFNTEcDtiRUdYqkQDxVkltzBRG+79jF1DviVErIzUY/7Mp4xKKa0Y6aXrKJRQiT2DWa63LUMYYw12.........完整代码请登录后点击上方下载按钮下载查看

网友评论0