仓库源文，站点原文

<script src="/jscss/jscex.min.js"></script> <script src="/jscss/CanvasText-0.4.1.js"></script><canvas id="myCanvas" style="border: 15px solid gray; -moz-border-radius-bottomleft: 40px; -moz-border-radius-bottomright: 40px; -webkit-border-bottom-left-radius: 40px; -webkit-border-bottom-right-radius: 40px; -webkit-border-top-left-radius: 40px; -webkit-border-top-right-radius: 40px;">对不起, 你的浏览器不支持canvas.</canvas><script> function QueryString() { var text,value,i; var str=location.href; var num=str.indexOf("?") str=str.substr(num+1); var arrtmp=str.split("&"); for(i=0;i < arrtmp.length;i++) { num=arrtmp[i].indexOf("="); if(num>0) { text=arrtmp[i].substring(0,num); value=arrtmp[i].substr(num+1); this[text]=value; } } } var Request=new QueryString(); var pageWidth=window.innerWidth, pageHeight=window.innerHeight; if(typeof pageWidth != "number") { if(document.compatMode=="CSSICompat") { pageWidth=document.documentElement.clientWidth; pageHeight=document.documentElement.clientHeight; } else { pageWidth=document.body.clientWidth; pageHeight=document.body.clientHeight; } } var CT = new CanvasText, dTime = 0; var canvas = document.getElementById("myCanvas"); var cxt = canvas.getContext("2d"); canvas.width=pageWidth canvas.height=pageHeight var posX=canvas.width/2, posY=canvas.height cxt.fillStyle = "#030303"; cxt.fillRect(0, 0, canvas.width, canvas.height); var img = new Image(); img.src = "/pic/eCard.png"; img.onload = function() { cxt.drawImage(img, posX, posY-140) } var cyc = 10; var a = 20; var balls = []; var ball = { x: posX+40, y: posY-140, r: 28, vx: 0, vy: -1250 }; balls.push(ball); var fireAsync = eval(Jscex.compile("async", function () { while (ball.y > posY*0.5) { cxt.fillStyle = "rgba(0, 0, 0, .3)"; cxt.fillRect(0, 0, canvas.width, canvas.height); cxt.fillStyle = "#fff"; cxt.drawImage(img, posX, posY-140); for (i in balls) { cxt.beginPath(); cxt.arc(balls[i].x, balls[i].y, balls[i].r, 0, Math.PI * 2, true); cxt.closePath(); cxt.fill(); balls[i].y += balls[i].vy * cyc / 1000; balls[i].x += balls[i].vx * cyc / 1000; if (balls[i].r + balls[i].y >= canvas.height) { if (balls[i].vy > 0) { balls[i].vy *= -0.7; } } else { balls[i].vy += a; } } $await(Jscex.Async.sleep(cyc)); } })) Vector2 = function (x, y) { this.x = x || 0; this.y = y || 0; }; var ball2s = []; for (var i = 0; i < 1000; i++) { var ball2 = { position: new Vector2(posX+40, 220), r: getRandomNumber(1, 4), vx: getRandomNumber(-200, 200), vy: getRandomNumber(-200, 200), color: randomColor() }; ball2s.push(ball2); } var t = 0; var moveAsync = eval(Jscex.compile("async", function() { while (true) { try { if (t > 1000) { t = 0; break; } t += cyc; cxt.fillStyle = "rgba(0, 0, 0, .3)"; cxt.fillRect(0, 0, canvas.width, canvas.height); cxt.fillStyle = "#fff"; cxt.drawImage(img, posX, posY-140); cxt.globalAlpha = (1200 - t) / 1200; if (t > 1000) ball2s.length = 0; for (i in ball2s) { cxt.fillStyle = ball2s[i].color; cxt.beginPath(); cxt.arc(ball2s[i].position.x, ball2s[i].position.y, ball2s[i].r, 0, Math.PI * 2, true); cxt.closePath(); cxt.fill(); if (ball2s[i].r + ball2s[i].position.x > canvas.width || ball2s[i].position.x < ball2s[i].r) ball2s[i].vx *= -1; if (ball2s[i].r + ball2s[i].position.y > canvas.height || ball2s[i].position.y < ball2s[i].r) ball2s[i].vy *= -1; ball2s[i].position.x += ball2s[i].vx * cyc / 1000; ball2s[i].position.y += ball2s[i].vy * cyc / 1000; } } catch (e) { alert(e); } $await(Jscex.Async.sleep(cyc)); } })) var drawAsync = eval(Jscex.compile("async", function () { cxt.globalAlpha = 1; while (true) { dTime += 100; CT.config({ canvas: canvas, context: cxt, fontSize: "54px", fontColor: "#ff0000", fontWeight: "bold", fontfamily:"" }); var text = '祝大家新年快乐!' if(Request["text"]) text = decodeURI(Request["text"]); CT.drawText({ text: text, x: posX/5, y: 250, boxWidth: 1555 }); if (dTime > 100) { dTime = 0; break; } $await(Jscex.Async.sleep(1000)); } })) var qAsync = eval(Jscex.compile("async", function () { while (true) { $await(fireAsync()); $await(moveAsync()); $await(drawAsync()); ball2s.length = 0; for (var i = 0; i <1000; i++) { var ball2 = { position: new Vector2(posX+40, 220), r: getRandomNumber(1, 4), vx: getRandomNumber(-200, 200), vy: getRandomNumber(-200, 200), color: randomColor() }; ball2s.push(ball2); } balls.length = 0; ball = { x: posX+40, y: posY-140, r: 28, vx: 0, vy: -1250 }; balls.push(ball); $await(Jscex.Async.sleep(1000)); } })) qAsync().start(); function getRandomNumber(min, max) { return (min+Math.floor(Math.random()*(max-min+1))) } function randomColor() { var arrHex = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"]; var strHex = "#"; var index; for (var i = 0; i < 6; i++) { index = Math.round(Math.random() * 15); strHex += arrHex[index]; } return strHex; } </script>