霓虹灯文字特效

来源：远方教程作者：远方教程发布时间：2014-11-07 查看次数：2850　访问[新版]

　　特效代码在文本域中，您可以点击文本域下方的预览按钮先查看效果。

<p>代码说明：本代码实现霓虹灯文字特效，思考以更换文字内容（text = "远方教程——满足您的求知欲"; //显示的文字 这行是待替换的文本）以实现不同的效果。代码如下：</p>
<p>------------------------------------------------ <SCRIPT language=JavaScript> 
<!-- Begin 
text = "远方教程——满足您的求知欲"; //显示的文字 
color1 = "blue"; //文字的颜色 
color2 = "red"; //转换的颜色 
fontsize = "6"; //字体大小 
speed = 100; //转换速度 (1000 = 1 秒) 
i = 0; 
if (navigator.appName == "Netscape") { 
document.write("<layer id=a visibility=show></layer><br><br><br>"); 
} 
else { 
document.write("<div id=a></div>"); 
} 
function changeCharColor() { 
if (navigator.appName == "Netscape") { 
document.a.document.write("<center><font face=arial size =" + fontsize + "><font color=" +

color1 + 
">"); 
for (var j = 0; j < text.length; j++) { 
if(j == i) { 
document.a.document.write("<font face=arial color=" + color2 + ">" + Text.charAt(i) +

"</font>"); 
} 
else { 
document.a.document.write(text.charAt(j)); 
} 
} 
document.a.document.write('</font></font></center>'); 
document.a.document.close(); 
} 
if (navigator.appName == "Microsoft Internet Explorer") { 
str = "<center><font face=arial size=" + fontsize + "><font color=" + color1 + ">"; 
for (var j = 0; j < text.length; j++) { 
if( j == i) { 
str += "<font face=arial color=" + color2 + ">" + text.charAt(i) + "</font>"; 
} 
else { 
str += text.charAt(j); 
} 
} 
str += "</font></font></center>"; 
a.innerHTML = str; 
} 
(i == text.length) ? i=0 : i++; 
} 
setInterval("changeCharColor()", speed); 
// End --> 
</SCRIPT></p>

标签：霓虹灯文特效导航 Google一下

分享到： QQ空间新浪微博腾讯微博人人网

打印 |

关闭评论

上一篇：爬梯子文字特效

下一篇：彩色打字机效果

·查看安全快捷上网技巧

图片新闻

美女户外健身, 美翻

真人美女和动漫美女

站内搜索

猜您喜欢