qq空间留言代码新年祝福，几行代码实现2023新年祝福

luoboai

本篇文章给大家谈谈qq空间留言代码新年祝福，以及几行代码实现2023新年祝福对应的知识点，文章可能有点长，但是希望大家可以阅读完，增长自己的知识，最重要的是希望对各位有所帮助，可以解决了您的问题，不要忘了收藏本站喔。

大家好，我是Echa，给大家拜年了！！！

在新的一年里，小编没有黄金万两，没有厚厚的红包，只有笑口常开，只有说不完的祝福，送给粉丝们。

每一声鞭炮响起，每一个烟花燃起，每一盏灯笼亮起，都流动着每一缕思念，每一份关怀，都凝聚着每一声问候，今年过节不收礼，随随便便过得去，包个红包就可以，多点少点不介意，或者来句评论话，知道把我记心里，我也为你送心意，愿粉丝们新年大吉，一切顺利！

今天小编给大家分享用几行代码怎么实现2023新年祝福。

大家猜猜这个是用啥实现的？先看效果图：

<!DOCTYPEhtml>\n<htmllang="en">\n<head>\n<metacharset="UTF-8">\n<title>Echa祝大家2023新年快乐！</title>\n</head>\n<style>\nbody{\nmargin:0;\noverflow:hidden;\nbackground:black;\n}\n\ncanvas{\nposition:absolute;\n}\n</style>\n\n<body>\n\n<canvas></canvas>\n<canvas></canvas>\n<canvas></canvas>\n\n<script>\n\nfunctionGetRequest(){\nvarurl=decodeURI(location.search);//获取url中"?"符后的字串\nvartheRequest=newObject();\nif(url.indexOf("?")!=-1){\nvarstr=url.substr(1);\nstrs=str.split("&");\nfor(vari=0;i<strs.length;i++){\ntheRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);\n}\n}\nreturntheRequest;\n}\nclassShard{\nconstructor(x,y,hue){\nthis.x=x;\nthis.y=y;\nthis.hue=hue;\nthis.lightness=50;\nthis.size=15+Math.random()*10;\nconstangle=Math.random()*2*Math.PI;\nconstblastSpeed=1+Math.random()*6;\nthis.xSpeed=Math.cos(angle)*blastSpeed;\nthis.ySpeed=Math.sin(angle)*blastSpeed;\nthis.target=getTarget();\nthis.ttl=100;\nthis.timer=0;\n}\ndraw(){\nctx2.fillStyle=`hsl(${this.hue},100%,${this.lightness}%)`;\nctx2.beginPath();\nctx2.arc(this.x,this.y,this.size,0,2*Math.PI);\nctx2.closePath();\nctx2.fill();\n}\nupdate(){\nif(this.target){\nconstdx=this.target.x-this.x;\nconstdy=this.target.y-this.y;\nconstdist=Math.sqrt(dx*dx+dy*dy);\nconsta=Math.atan2(dy,dx);\nconsttx=Math.cos(a)*5;\nconstty=Math.sin(a)*5;\nthis.size=lerp(this.size,1.5,0.05);\n\nif(dist<5){\nthis.lightness=lerp(this.lightness,100,0.01);\nthis.xSpeed=this.ySpeed=0;\nthis.x=lerp(this.x,this.target.x+fidelity/2,0.05);\nthis.y=lerp(this.y,this.target.y+fidelity/2,0.05);\nthis.timer+=1;\n}else\nif(dist<10){\nthis.lightness=lerp(this.lightness,100,0.01);\nthis.xSpeed=lerp(this.xSpeed,tx,0.1);\nthis.ySpeed=lerp(this.ySpeed,ty,0.1);\nthis.timer+=1;\n}else{\nthis.xSpeed=lerp(this.xSpeed,tx,0.02);\nthis.ySpeed=lerp(this.ySpeed,ty,0.02);\n}\n}else{\nthis.ySpeed+=0.05;\n//this.xSpeed=lerp(this.xSpeed,0,0.1);\nthis.size=lerp(this.size,1,0.05);\n\nif(this.y>c2.height){\nshards.forEach((shard,idx)=>{\nif(shard===this){\nshards.splice(idx,1);\n}\n});\n}\n}\nthis.x=this.x+this.xSpeed;\nthis.y=this.y+this.ySpeed;\n}\n}\n\nclassRocket{\nconstructor(){\nconstquarterW=c2.width/4;\nthis.x=quarterW+Math.random()*(c2.width-quarterW);\nthis.y=c2.height-15;\nthis.angle=Math.random()*Math.PI/4-Math.PI/6;\nthis.blastSpeed=6+Math.random()*7;\nthis.shardCount=15+Math.floor(Math.random()*15);\nthis.xSpeed=Math.sin(this.angle)*this.blastSpeed;\nthis.ySpeed=-Math.cos(this.angle)*this.blastSpeed;\nthis.hue=Math.floor(Math.random()*360);\nthis.trail=[];\n}\ndraw(){\nctx2.save();\nctx2.translate(this.x,this.y);\nctx2.rotate(Math.atan2(this.ySpeed,this.xSpeed)+Math.PI/2);\nctx2.fillStyle=`hsl(${this.hue},100%,50%)`;\nctx2.fillRect(0,0,5,15);\nctx2.restore();\n}\nupdate(){\nthis.x=this.x+this.xSpeed;\nthis.y=this.y+this.ySpeed;\nthis.ySpeed+=0.1;\n}\n\nexplode(){\nfor(leti=0;i<70;i++){\nshards.push(newShard(this.x,this.y,this.hue));\n}\n}\n}\n\nconsole.log(GetRequest('val').val)\n//INITIALIZATION\nconst[c1,c2,c3]=document.querySelectorAll('canvas');\nconst[ctx1,ctx2,ctx3]=[c1,c2,c3].map(c=>c.getContext('2d'));\nletfontSize=200;\nconstrockets=[];\nconstshards=[];\nconsttargets=[];\nconstfidelity=3;\nletcounter=0;\nc2.width=c3.width=window.innerWidth;\nc2.height=c3.height=window.innerHeight;\nctx1.fillStyle='#000';\nconsttext='Echa祝大家2023新年快乐！'\nlettextWidth=99999999;\n\nwhile(textWidth>window.innerWidth){\nctx1.font=`900${fontSize--}pxArial`;\ntextWidth=ctx1.measureText(text).width;\n}\n\nc1.width=textWidth;\nc1.height=fontSize*1.5;\nctx1.font=`900${fontSize}pxArial`;\nctx1.fillText(text,0,fontSize);\nconstimgData=ctx1.getImageData(0,0,c1.width,c1.height);\nfor(leti=0,max=imgData.data.length;i<max;i+=4){\nconstalpha=imgData.data[i+3];\nconstx=Math.floor(i/4)%imgData.width;\nconsty=Math.floor(i/4/imgData.width);\n\nif(alpha&&x%fidelity===0&&y%fidelity===0){\ntargets.push({x,y});\n}\n}\n\nctx3.fillStyle='#FFF';\nctx3.shadowColor='#FFF';\nctx3.shadowBlur=25;\n\n//ANIMATIONLOOP\n(functionloop(){\nctx2.fillStyle="rgba(0,0,0,.1)";\nctx2.fillRect(0,0,c2.width,c2.height);\n//ctx2.clearRect(0,0,c2.width,c2.height);\ncounter+=1;\n\nif(counter%15===0){\nrockets.push(newRocket());\n}\nrockets.forEach((r,i)=>{\nr.draw();\nr.update();\nif(r.ySpeed>0){\nr.explode();\nrockets.splice(i,1);\n}\n});\n\nshards.forEach((s,i)=>{\ns.draw();\ns.update();\n\nif(s.timer>=s.ttl||s.lightness>=99){\nctx3.fillRect(s.target.x,s.target.y,fidelity+1,fidelity+1);\nshards.splice(i,1);\n}\n});\n\nrequestAnimationFrame(loop);\n})();\n\n//HELPERFUNCTIONS\nconstlerp=(a,b,t)=>Math.abs(b-a)>0.1?a+t*(b-a):b;\n\nfunctiongetTarget(){\nif(targets.length>0){\nconstidx=Math.floor(Math.random()*targets.length);\nlet{x,y}=targets[idx];\ntargets.splice(idx,1);\n\nx+=c2.width/2-textWidth/2;\ny+=c2.height/2-fontSize/2;\n\nreturn{x,y};\n}\n}\n</script>\n</body>\n</html>无限放烟花

一个个烟花，在夜空绽放。有的像繁星在调皮的眨眼，有的像一个闪闪发光的圆球，有的像已绽放的紫色蒲公英，有的像娇艳的花朵……烟花好美啊！

用鼠标无限点击，无限放烟花.......

<!DOCTYPEhtml>\n<htmllang="en">\n\n<head>\n\t<metacharset="UTF-8">\n\t<title>\n\t\tEcha祝大家2023一帆风顺\n\t</title>\n\t<metaname="viewport"content="width=device-width,initial-scale=1,user-scalable=no">\n\t<metaname="mobile-web-app-capable"content="yes">\n\t<metaname="apple-mobile-web-app-capable"content="yes">\n\t<metaname="theme-color"content="#000000">\n\t<linkrel="icon"type="image/png"href="./favicon.png">\n\t<linkrel="apple-touch-icon-precomposed"href="./favicon.png">\n\t<metaname="msapplication-TileColor"content="#000000">\n\t<metaname="msapplication-TileImage"content="./favicon.png">\n\t<style>\n\t\t/*cyrillic*/\n\t\t@font-face{\n\t\t\tfont-family:'RussoOne';\n\t\t\tfont-style:normal;\n\t\t\tfont-weight:400;\n\t\t\tsrc:url(/font/Z9XUDmZRWg6M1LvRYsHOy8mJrrg.woff2)format('woff2');\n\t\t\tunicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;\n\t\t}\n\n\t\t/*latin-ext*/\n\t\t@font-face{\n\t\t\tfont-family:'RussoOne';\n\t\t\tfont-style:normal;\n\t\t\tfont-weight:400;\n\t\t\tsrc:url(/font//Z9XUDmZRWg6M1LvRYsHOwcmJrrg.woff2)format('woff2');\n\t\t\tunicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;\n\t\t}\n\n\t\t/*latin*/\n\t\t@font-face{\n\t\t\tfont-family:'RussoOne';\n\t\t\tfont-style:normal;\n\t\t\tfont-weight:400;\n\t\t\tsrc:url(/font/Z9XUDmZRWg6M1LvRYsHOz8mJ.woff2)format('woff2');\n\t\t\tunicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;\n\t\t}\n\t</style>\n\t<linkrel="stylesheet"href="./style.css">\n</head>\n\n<body>\n\t<divstyle="height:0;width:0;position:absolute;visibility:hidden;">\n\t\t<svgxmlns="http://www.w3.org/2000/svg">\n\t\t\t<symbolid="icon-play"viewBox="002424">\n\t\t\t\t<pathd="M85v14l11-7z"/>\n\t\t\t</symbol>\n\t\t\t<symbolid="icon-pause"viewBox="002424">\n\t\t\t\t<pathd="M619h4V5H6v14zm8-14v14h4V5h-4z"/>\n\t\t\t</symbol>\n\t\t\t<symbolid="icon-close"viewBox="002424">\n\t\t\t\t<path\n\t\t\t\t\td="M196.41L17.5951210.596.41556.4110.5912517.596.41191213.4117.59191917.5913.4112z"/>\n\t\t\t</symbol>\n\t\t\t<symbolid="icon-settings"viewBox="002424">\n\t\t\t\t<path\n\t\t\t\t\td="M19.4312.98c.04-.32.07-.64.07-.98s-.03-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.491c-.52-.4-1.08-.73-1.69-.98l-.38-2.65C14.462.1814.252142h-4c-.250-.46.18-.49.42l-.382.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.490-.61.22l-23.46c-.13.22-.07.49.12.64l2.111.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.111.65c-.19.15-.24.42-.12.64l23.46c.12.22.39.3.61.22l2.49-1c.52.41.08.731.69.98l.382.65c.03.24.24.42.49.42h4c.250.46-.18.49-.42l.38-2.65c.61-.251.17-.591.69-.98l2.491c.23.09.490.61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zM1215.5c-1.930-3.5-1.57-3.5-3.5s1.57-3.53.5-3.53.51.573.53.5-1.573.5-3.53.5z"/>\n\t\t\t</symbol>\n\t\t\t<symbolid="icon-sound-on"viewBox="002424">\n\t\t\t\t<path\n\t\t\t\t\td="M39v6h4l55V4L79H3zm13.53c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.732.5-2.252.5-4.02zM143.23v2.06c2.89.8653.5456.71s-2.115.85-56.71v2.06c4.01-.917-4.497-8.77s-2.99-7.86-7-8.77z"/>\n\t\t\t</symbol>\n\t\t\t<symbolid="icon-sound-off"viewBox="002424">\n\t\t\t\t<path\n\t\t\t\t\td="M16.512c0-1.77-1.02-3.29-2.5-4.03v2.21l2.452.45c.03-.2.05-.41.05-.63zm2.50c0.94-.21.82-.542.64l1.511.51C20.6314.912113.52112c0-4.28-2.99-7.86-7-8.77v2.06c2.89.8653.5456.71zM4.273L34.277.739H3v6h4l55v-6.73l4.254.25c-.67.52-1.42.93-2.251.18v2.06c1.38-.312.63-.953.69-1.81L19.73212119.73l-9-9L4.273zM124L9.916.09128.18V4z"/>\n\t\t\t</symbol>\n\t\t</svg>\n\t</div>\n\t\n\t<divclass="container">\n\t\t<divclass="loading-init">\n\t\t\t<divclass="loading-init__header">\n\t\t\t\t加载中\n\t\t\t</div>\n\t\t\t<divclass="loading-init__status">\n\t\t\t\t正在装配兔年烟花\n\t\t\t</div>\n\t\t</div>\n\t\t<divclass="stage-containerremove">\n\t\t\t<divclass="canvas-container">\n\t\t\t\t<canvasid="trails-canvas">\n\t\t\t\t</canvas>\n\t\t\t\t<canvasid="main-canvas">\n\t\t\t\t</canvas>\n\t\t\t</div>\n\t\t\t<divclass="controls">\n\t\t\t\t<divclass="btnpause-btn">\n\t\t\t\t\t<svgfill="white"width="24"height="24">\n\t\t\t\t\t\t<usehref="#icon-pause"xlink:href="#icon-pause">\n\t\t\t\t\t\t</use>\n\t\t\t\t\t</svg>\n\t\t\t\t</div>\n\t\t\t\t<divclass="btnsound-btn">\n\t\t\t\t\t<svgfill="white"width="24"height="24">\n\t\t\t\t\t\t<usehref="#icon-sound-off"xlink:href="#icon-sound-off">\n\t\t\t\t\t\t</use>\n\t\t\t\t\t</svg>\n\t\t\t\t</div>\n\t\t\t\t<divclass="btnsettings-btn">\n\t\t\t\t\t<svgfill="white"width="24"height="24">\n\t\t\t\t\t\t<usehref="#icon-settings"xlink:href="#icon-settings">\n\t\t\t\t\t\t</use>\n\t\t\t\t\t</svg>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<divclass="menuhide">\n\t\t\t\t<divclass="menu__inner-wrap">\n\t\t\t\t\t<divclass="btnbtn--brightclose-menu-btn">\n\t\t\t\t\t\t<svgfill="white"width="24"height="24">\n\t\t\t\t\t\t\t<usehref="#icon-close"xlink:href="#icon-close">\n\t\t\t\t\t\t\t</use>\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t</div>\n\t\t\t\t\t<divclass="menu__header">\n\t\t\t\t\t\t设置\n\t\t\t\t\t</div>\n\t\t\t\t\t<divclass="menu__subheader">\n\t\t\t\t\t\t若想了解更多信息请点击任意标签\n\t\t\t\t\t</div>\n\t\t\t\t\t<form>\n\t\t\t\t\t\t<divclass="form-optionform-option--select">\n\t\t\t\t\t\t\t<labelclass="shell-type-label">\n\t\t\t\t\t\t\t\t烟花类型\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<selectclass="shell-type">\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<divclass="form-optionform-option--select">\n\t\t\t\t\t\t\t<labelclass="shell-size-label">\n\t\t\t\t\t\t\t\t烟花大小\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<selectclass="shell-size">\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<divclass="form-optionform-option--select">\n\t\t\t\t\t\t\t<labelclass="quality-ui-label">\n\t\t\t\t\t\t\t\t画质\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<selectclass="quality-ui">\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<divclass="form-optionform-option--select">\n\t\t\t\t\t\t\t<labelclass="sky-lighting-label">\n\t\t\t\t\t\t\t\t照亮天空\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<selectclass="sky-lighting">\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<divclass="form-optionform-option--select">\n\t\t\t\t\t\t\t<labelclass="scaleFactor-label">\n\t\t\t\t\t\t\t\t缩放\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<selectclass="scaleFactor">\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<divclass="form-optionform-option--checkbox">\n\t\t\t\t\t\t\t<labelclass="auto-launch-label">\n\t\t\t\t\t\t\t\t自动放烟花\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<inputclass="auto-launch"type="checkbox"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<divclass="form-optionform-option--checkboxform-option--finale-mode">\n\t\t\t\t\t\t\t<labelclass="finale-mode-label">\n\t\t\t\t\t\t\t\t同时放更多的烟花\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<inputclass="finale-mode"type="checkbox"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<divclass="form-optionform-option--checkbox">\n\t\t\t\t\t\t\t<labelclass="hide-controls-label">\n\t\t\t\t\t\t\t\t隐藏控制按钮\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<inputclass="hide-controls"type="checkbox"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<divclass="form-optionform-option--checkboxform-option--fullscreen">\n\t\t\t\t\t\t\t<labelclass="fullscreen-label">\n\t\t\t\t\t\t\t\t全屏\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<inputclass="fullscreen"type="checkbox"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<divclass="form-optionform-option--checkbox">\n\t\t\t\t\t\t\t<labelclass="long-exposure-label">\n\t\t\t\t\t\t\t\t保留烟花的火花\n\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t<inputclass="long-exposure"type="checkbox"/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</form>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<divclass="help-modal">\n\t\t\t<divclass="help-modal__overlay">\n\t\t\t</div>\n\t\t\t<divclass="help-modal__dialog">\n\t\t\t\t<divclass="help-modal__header">\n\t\t\t\t</div>\n\t\t\t\t<divclass="help-modal__body">\n\t\t\t\t</div>\n\t\t\t\t<buttontype="button"class="help-modal__close-btn">\n\t\t\t\t\t关闭\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n\t<script></script>\n\t\n\t<scriptsrc='./js/fscreen.js'></script>\n\t<scriptsrc='./js/Stage.js'></script>\n\t<scriptsrc='./js/MyMath.js'></script>\n\t<scriptsrc="./js/script.js"></script>\n</body>\n\n</html>

完整代码：https://gitee.com/webufo/fireworks

演示地址：https://jsmask.gitee.io/rabbit-lucky-chest/

Gitee：https://gitee.com/jsmask/rabbit-lucky-chest

小兔子乖乖，快把眼睁开，看窗外，阳光好、鸟儿叫，微风摇、人欢笑；小兔子乖乖，悄悄地起床来，吹吹风、跳一跳，一整天，心情好。乖，早安！

演示地址：https://what-to-drink.gitee.io/2023//index.html

Gitee：https://gitee.com/what-to-drink/2023

春节到，拜年早；送你一杯香醇酒，愿你跟着好运走；送你一幅吉祥画，生活幸福人人夸；送你一盏红灯笼，万事吉祥家业兴；兔年大吉，提前祝贺！

文章到此结束，如果本次分享的qq空间留言代码新年祝福和几行代码实现2023新年祝福的问题解决了您的问题，那么我们由衷的感到高兴！