Neon Lights Text - An effective way to draw attention to your webpage text!
Compatible Browsers: Example: View Code Demo |
<html>
<head>
<title>Neon Lights Text Javascript Code Snippet</title>
<style>
BODY {font-family:verdana,arial,ms sans serif; font-size:90%;}
</style>
</head>
<body>
<h3>
<script>// <![CDATA[
<!--
/*
// Begin Neon Lights Text
// == This Script Free To Use Providing This Notice Remains ==
// == This Script Has Been Found In The https://snapbuilder.com Free Public Codes Library ==
// == NOTICE: Though This Material May Have Been In A Public Depository, Certain Author Copyright Restrictions May Apply ==
// == Created by: JavaScript Kit : http://javascriptkit.com : Creative Commons License ==
*/
-->
var message=" Welcome to SnapBuilder.com!"
var neonbasecolor="#cccccc" // the text color value
var neontextcolor="#007730" // the neon changer color value
var flashspeed=100 //in milliseconds
// No need to edit below this line //
var n=0
if (document.all||document.getElementById){
document.write('<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')
}
else
document.write(message)
function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}
function neon(){
//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
// eval("document.all.neonlight"+m).style.color=neonbasecolor
crossref(m).style.color=neonbasecolor
}
// cycle through and change individual letters to neon color
crossref(n).style.color=neontextcolor
if (n<message.length-1)
n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",1500)
return
}
}
function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()
// ]]>
</script>
</h3>
<br /><br />
<p>Formatting is accomplished with simple HTML.</p>
<p>You can transfer the 'javascript' code to an external file to minify your page size.</p>
</body>
</html>
|
Scroll