3D文字旋转有空间立体感

2024-09-05 12:21:36

字体：大中小

来源：转载

供稿：网友

JavaScript实现3D文字旋转有空间立体感，文字围绕一个圆心旋转，当前文字变大号，转动后变小，形成由近及远的感觉，从而形成空间立体感。

<HTML><HEAD><TITLE>旋转变换文字</TITLE><META http-equiv=Content-Type content="text/html; charset=gb2312"></HEAD><BODY><SCRIPT language=javascript>Phrase="武林网欢迎你的光临"Balises=""Taille=40;Midx=100;Decal=0.5;Nb=Phrase.length;y=-10000;for (x=0;x<Nb;x++){  Balises=Balises + '<DIV Id=L' + x + ' STYLE="width:4;font-family: Courier New;font-weight:bold;position:absolute;top:210;left:300;z-index:0">' + Phrase.charAt(x) + '</DIV>'}document.write (Balises);Time=window.setInterval("Alors()",10);Alpha=5;I_Alpha=0.05;function Alors(){	Alpha=Alpha-I_Alpha;	for (x=0;x<Nb;x++){		Alpha1=Alpha+Decal*x;		Cosine=Math.cos(Alpha1);		Ob=document.all("L"+x);		Ob.style.posLeft=Midx+100*Math.sin(Alpha1)+260;		Ob.style.zIndex=10*Cosine;		Ob.style.fontSize=Taille+25*Cosine;		Ob.style.color="rgb("+ (20+Cosine*80+150) + ","+ (227+Cosine*80+250) + ",0)";	}}</SCRIPT><CENTER>旋转变换文字</CENTER><CENTER><p></p><TABLE borderColor=#99FFFF border=5 borderlight="green">  <TBODY>  <TR>  <TD width=330 height=300></TD></TR></TBODY></TABLE></CENTER></BODY></HTML>

上一篇：DOM跑马灯文字效果

下一篇：文字背景响应鼠标变色