好资源导航 » 文章资讯 » JS实现520 表白简单代码

JS实现520 表白简单代码

2023-09-12 14:35:04 63

这两天不知道咋了，迷迷糊糊的，突然知道今天是520的我，急急忙忙赶出个程序（新手，代码有点乱），发出来大家一起研究下（参考百度的）。

520

functionisIE(){ varu=navigator.userAgent; if((u.indexOf("compatible")>-1&&u.indexOf("MSIE")>-1)||(u.indexOf("Trident")>-1&&u.indexOf("rv:11.0")>-1)){ alert("该浏览器暂不支持，请更换浏览器"); window.open('','_self'); window.close(); } varaudio=document.createElement("audio"); audio.setAttribute("src","./520-love.mp3"); audio.setAttribute("autoplay","autoplay"); } isIE(); vartextArr=[ 'Ilovethreethingsinthisworld,', 'thesun,themoonandyou.', 'Thesunfortheday,', 'themoonforthenight,', 'andyouforever!', '', 'Ifyouwereateardrop,', 'inmyeye,', 'forfearoflosingyou,', 'Iwouldnevercry.', 'Andifthegoldensun,', 'shouldceasetoshineitslight,', 'justonesmilefromyou,', 'wouldmakemywholeworldbright.' ]; vartext_520=document.getElementById('text_520'); varheight=(window.innerHeight-text_520.offsetHeight)/2; varwidth=(window.innerWidth-text_520.offsetWidth)/2; text_520.style.top=height+'px'; text_520.style.left=width+'px'; $('#text_520').hide(); $('.img').hide(); varm=0; varn=0; vartext=document.getElementById('text'); functiontyping(){ if(m<=textArr[n].length){ text.innerHTML=text.innerHTML.substring(0,text.innerHTML.length-1)+textArr[n].substr(m++,1)+'_'; setTimeout(typing,250); }else{ if(n_"; n++; m=0; typing(); }else{ text.innerHTML=text.innerHTML.substring(0,text.innerHTML.length-1); $('#text').fadeOut(5000); setTimeout(function(){$('#text_520').fadeIn(5000);},7000); setTimeout(function(){$('#text_520').fadeOut(5000);},7000); setTimeout(function(){$('.img').fadeIn(50000);},15000) } } } setTimeout(typing,5000); varctx=document.querySelector('canvas').getContext('2d'); ctx.canvas.width=window.innerWidth; ctx.canvas.height=window.innerHeight; varsparks=[]; varfireworks=[]; varwalker; fireworks.pop(); vari=10; while(i--)fireworks.push(newFirework(Math.random()*window.innerWidth,window.innerHeight*Math.random())); //setInterval(render,1000/50); render(); functionrender(){ setTimeout(render,1000/50); ctx.fillStyle='rgba(0,0,0,0.2)'; ctx.fillRect(0,0,ctx.canvas.width,ctx.canvas.height); //上升效果 for(varfireworkoffireworks){ if(firework.dead)continue; firework.move(); firework.draw(); } //绽放效果 for(varsparkofsparks){ if(spark.dead)continue; spark.move(); spark.draw(); } if(Math.random()<0.1)fireworks.push(newFirework()); //ctx.height=ctx.height; } functionSpark(x,y,color){ this.x=x; this.y=y; this.dir=Math.random()*(Math.PI*2); this.dead=false; this.color=color; this.speed=Math.random()*3+3; walker=newWalker({radius:20,speed:0.25}); this.gravity=0.25; this.dur=this.speed/0.15; this.move=function(){ this.dur--; if(this.dur<0)this.dead=true; if(this.speed<0)return; if(this.speed>0)this.speed-=0.15; walk=walker.step(); this.x+=Math.cos(this.dir+walk)*this.speed; this.y+=Math.sin(this.dir+walk)*this.speed; this.y+=this.gravity; this.gravity+=0.05; } this.draw=function(){ drawCircle(this.x,this.y,2,this.color); } } functionFirework(x,y){ this.xmove=Math.random()*2-1; this.x=x||Math.random()*ctx.canvas.width; this.y=y||ctx.canvas.height; this.height=Math.random()*ctx.canvas.height/2; this.dead=false; this.color=randomColor(); this.move=function(){ this.x+=this.xmove; if(this.y>this.height)this.y-=4; elsethis.burst(); } this.draw=function(){ drawCircle(this.x,this.y,3,this.color) } this.burst=function(){ this.dead=true i=100;while(i--)sparks.push(newSpark(this.x,this.y,this.color)); sparks.pop(); } } setTimeout(function(){window.open('','_self').close();},175000); /* //清除两个数组 functionclear(){ if(sparks!=null||fireworks!=null){ sparks.pop(); fireworks.pop(); } varsparks=[]; varfireworks=[]; } setInterval(clear,100); */ functiondrawCircle(x,y,radius,color){ color=color||'#FFF'; ctx.fillStyle=color; ctx.fillRect(x-radius/2,y-radius/2,radius,radius); } functionrandomColor(){ return['#6ae5ab','#88e3b2','#36b89b','#7bd7ec','#66cbe1'][Math.floor(Math.random()*5)]; } functionWalker(options){ this.step=function(){ this.direction=Math.sign(this.target)*this.speed this.value+=this.direction this.target ?this.target-=this.direction :(this.value) ?(this.wander) ?this.target=this.newTarget() :this.target=-this.value :this.target=this.newTarget() returnthis.direction } this.newTarget=function(){ returnMath.round(Math.random()*(this.radius*2)-this.radius) } this.start=0 this.value=0 this.radius=options.radius this.target=this.newTarget() this.direction=Math.sign(this.target) this.wander=options.wander this.speed=options.speed||1 }

总结

以上所述是小编给大家介绍的JS实现520简单表白代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持！

返回顶部
514930285
czq8825@qq.com

JS实现520 表白简单代码

热门推荐

随机推荐