canvas正方形放大动画效果代码
代码语言:html
所属分类:动画
代码描述:canvas正方形放大动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body,html{ background: #000; margin: 0; height: 100vh; overflow: hidden; } #c{ background:#000; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } </style> </head> <body > <canvas id=c> <script> c = document.querySelector('#c'); x = c.getContext('2d'); S = Math.sin; C = Math.cos; Rn = Math.random; t = go = 0; rsz = window.onresize = () => { setTimeout(() => { if (document.body.clientWidth > document.body.clientHeight * 1.77777778) { c.style.height = '100vh'; setTimeout(() => c.style.width = c.clientHeight * 1.77777778 + 'px', 0); } else { c.style.width = '100vw'; setTimeout(() => c.style.height = c.clientWidth / 1.77777778 + 'px', 0); } c.width = 1920; c.height = c.width / 1.777777778;.........完整代码请登录后点击上方下载按钮下载查看
网友评论0