js实现canvas多彩正方体下落动画效果代码
代码语言:html
所属分类:动画
代码描述:js实现canvas多彩正方体下落动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> * { padding: 0; margin: 0; overflow: hidden; background: #FFF; } canvas { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); } </style> </head> <body> <script> var W, M, c, C, WW, WH, CW, CH, options, radian, num, colors, animationId; var getRandomNumber = function (min, max) { return Math.floor(Math.random() * (max - min + 1) + min); }; var makeCanvas = function () { document. getElementsByTagName("body")[0]. appendChild(document.createElement("canvas")); }; var initialize = function () { W = window; M = Math; c = document.getElementsByTagName("canvas")[0]; C = c.getContext("2d"); WW = c.width = 500; WH = c.height = 500; WD = M.sqrt(WW * WW + WH * WH); CW = WW / 2; CH = WH / 2; CD = WD / 2; num = 2; colors = ['#563672', '#8D3D77', '#C6427A', '#FD497F']; radian = Math.PI * 2 / 6; options = getOptions(); c.style.background = 'white';.........完整代码请登录后点击上方下载按钮下载查看
网友评论0