JS-Methode zum Erlernen von Neontexteffekten_Javascript-Fähigkeiten-js-Tutorial-php.cn

JS-Methode zum Erlernen von Neontexteffekten_Javascript-Fähigkeiten

WBOY

Freigeben： 2016-05-16 15:46:37

Original

1709 Leute haben es durchsucht

Das Beispiel in diesem Artikel beschreibt, wie Sie den Neontexteffekt mit JS erzielen. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Hier verwenden wir JS, um den Neontext-Spezialeffektcode auf der Webseite zu implementieren. Schauen Sie sich den Laufeffekt an. Sie werden sehen, dass die Farbe des Textes wie ein Neonlicht ist, das sich kontinuierlich ändert, farbenfroh und blendend ist. daher heißt es „Text“, man kann es auch „Textfarbwechseleffekt“ nennen.

Der Screenshot des Laufeffekts sieht wie folgt aus:

Der spezifische Code lautet wie folgt:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>霓虹灯</title>
</head>
<body>
<script>
var Tname="欢迎您的到来！";
var Tlen=Tname.length;
document.write("<div id='a' style='font-size:40px;'>"+Tname+"</div>");
var col=new Array("#FFCC00","#3333FF","#FFCC00","#FF0000","#FFCC00","#CC33FF");
var ic=0;
function Dcolor(){
 var Strname="";
 for (i=0;i<Tlen;++i){
  var Strname=Strname+"<font color="+col[ic]+">"+Tname.substring(i,i+1)+"</font>";
 ic=ic+1;
  if (ic==col.length) ic=0;
 }
 a.innerHTML=Strname;
 setTimeout("Dcolor()",200);
}
Dcolor();
</script>
<span class="style5"></span>
</body>
</html>

Nach dem Login kopieren

Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.