荧光灯文字效果_网页文本特效

·网页特效库 ·网页工具库

背景按钮

导航特效

< 后退 | 收藏网页特效库

推荐网页特效

推荐网页工具

您的位置：网页特效库 >> 网页文本特效 >> 荧光灯文字效果	查看此特效演示

荧光灯文字效果

把如下代码复制到<body>与</body>之间

/*
Neon Lights Text
By Website Abstraction (http://www.butong.net)
Over 400+ free scripts here!
*/

var message="Welcome to http://www.butong.net !"
var neonbasecolor="black"
var neontextcolor="yellow"
var flashspeed=100  //in milliseconds

///No need to edit below this line/////

var n=0
if (document.all){
document.write('<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight">'+message.charAt(m)+'</span>')
document.write('</font>')

//cache reference to neonlight array
var tempref=document.all.neonlight
}
else
document.write(message)

function neon(){

//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
tempref[m].style.color=neonbasecolor
}

//cycle through and change individual letters to neon color
tempref[n].style.color=neontextcolor

if (n<tempref.length-1)
n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",1500)
return
}
}

function beginneon(){
if (document.all)
flashing=setInterval("neon()",flashspeed)
}
beginneon()

</script>
</td>
            </h2>

使用说明：代码中var message的值为荧光文字的内容，var neonbasecolor和var neontextcolor的值分别为文字的底色颜色和荧光颜色，这些可自行修改。

上一个特效：圆弧旋转文字

返回列表

下一个特效：警示效果-震颤文字