Heim >Web-Frontend >js-Tutorial >JS-Methode zum Erlernen von Neontexteffekten_Javascript-Fähigkeiten

JS-Methode zum Erlernen von Neontexteffekten_Javascript-Fähigkeiten

WBOY
WBOYOriginal
2016-05-16 15:46:371727Durchsuche

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>

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

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn