波浪文字特效，很逼真哦

2024-09-05 12:21:27

字体：大中小

来源：转载

供稿：网友

很逼真的波浪文字特效，像是以前玩的一个游戏一样，由第一个字母依次向后倒。不过看上去这种效果用水纹、波浪形容好像更贴切一些吧。注意文字和文字颜色以及链接信息都是在JS中修改，应该不难改。

<html><head><title>水波文字</title></head><body><script>message="文字水波特效，很逼真的效果"ns6switch=1var ns6=document.getElementById && !document.allmes=new Array();mes[0]=-1;mes[1]=-4;mes[2]=-7;mes[3]=-10;mes[4]=-7;mes[5]=-4;mes[6]=-1;num=0;num2=0;txt="";function jump0(){if (ns6 && !ns6switch){jump.innerHTML=messagereturn}if(message.length > 6){for(i=0; i != message.length;i++){txt=txt+"<span style='position:relative;' id='n"+i+"'>"+message.charAt(i)+"</span>"};jump.innerHTML=txt;txt="";jump1a()}else{alert("/")}}function jump1a(){nfinal=(document.getElementById)? document.getElementById("n0") : document.all.n0nfinal.style.left=-num2;if(num2 != 9){num2=num2+3;setTimeout("jump1a()",50)}else{jump1b()}}function jump1b(){nfinal.style.left=-num2;if(num2 != 0){num2=num2-3;setTimeout("jump1b()",50)}else{jump2()}}function jump2(){txt="";for(i=0;i != message.length;i++){if(i+num > -1  &&  i+num < 7){txt=txt+"<span style='position:relative;top:"+mes[i+num]+"'>"+message.charAt(i)+"</span>"}else{txt=txt+"<span>"+message.charAt(i)+"</span>"}}jump.innerHTML=txt;txt="";if(num != (-message.length)){num--;setTimeout("jump2()",50)}else{num=0;setTimeout("jump0()",50)}}</script><h2><div id="jumpx" style="color:red"></div></h2><script>if (document.all||document.getElementById){jump=(document.getElementById)? document.getElementById("jumpx") : document.all.jumpxjump0()}elsedocument.write(message)</script></body></html>

上一篇：像歌词跟着声音走的JS文字效果

下一篇：Js随机文字显示

学习交流

如何查找有故障的配件

如何查找有故障的配件...

热门图片

猜你喜欢的新闻

猜你喜欢的关注