LED Display or Scrolling text using javascript

Simple script to display LED type text using javascript
Add this line @ the head section of your webpage

The JS file [LED.JS]

// the number of characters in the display
mwidth=20;

// delay in milliseconds between character shifts
mdelay=200;

// set to true if you want to reduce multiple spaces to a single space
dumpExtraSpaces=false;

mpos=0;
chars=" 0123456789abcdefghijklmnopqrstuvwxyz+-*/=?^&().,'!~$";
content=new Array();
color=new Array();

colors=new Array();
  colors['green']=0;
  colors['yellow']=-27;
  colors['red']=-54;
  colors['blue']=-81;

colorind=new Array();
  colorind[0]='green';
var mtxt;

function marqueeInit(){
 	mtxt=document.getElementById("ledmarquee").innerHTML.toLowerCase();
 	mtxt=mtxt.replace(/\.\.\./g,'~');
 	mtxt=mtxt.replace(/&/g,'&');
 	mtxt=mtxt.replace(/"/g,"'");
 	mtxt=mtxt.replace(/\[/g,'(');
 	mtxt=mtxt.replace(/\]/g,')');
 	mtxt=mtxt.replace(/\{/g,'(');
 	mtxt=mtxt.replace(/\}/g,')');
 	mtxt=mtxt.replace(/[\n\r]/g,' ');
 	if(dumpExtraSpaces) mtxt=mtxt.replace(/\s{2,}/g,' ');
 	bpos=mtxt.indexOf('< ');
 	attempt=0;
 	while(bpos>=0){
  		mtxt.search(/< ([^>]*)>/);
  		ctmp=RegExp.$1;
  		colorind[bpos]=ctmp;
  		mtxt=mtxt.replace(/< [^>]*>/,'');
  		bpos=mtxt.indexOf('< ');
  		attempt++;
  		if(attempt>500){
  			// prevent browser lockups if something goes fishy (open < )
   			alert('parse failure');
  			 return false;
  		}
 	}
 	mcont="<div style='display:none'>"+mtxt+"<p> </p>";
 	for(i=0;i<mwidth ;i++){
  		mcont+="<div class='digit' id='js_dig"+i+"'>\n";
  		mtxt=' '+mtxt+' ';
 	}
 	curcolor=0;
 	for(i=0;i<mtxt .length;i++){
  		if(colorind[i-mwidth]!=null){
  			 curcolor=colors[colorind[i-mwidth]]||0;
 		 }
 		color[i]=curcolor;
 		content[i]=-16*chars.indexOf(mtxt.substr(i,1));
 	}
 	document.getElementById("ledmarquee").style.width=(mwidth*16)+'px';
 	document.getElementById("ledmarquee").innerHTML=mcont;
 	document.getElementById("ledmarquee").style.visibility='visible';
 	mtimer=setInterval('marqueeScroll()',mdelay);
}

function marqueeScroll(){
	for(i=0;i<mwidth;i++){
 		document.getElementById('js_dig'+i).style.backgroundPosition=content[i+mpos]+'px '+color[i+mpos]+'px';
	}
	mpos++;
	if(mpos==mtxt.length-mwidth) mpos=0;
}

function onloadAppend(func){
 	var oldonload=window.onload;
 	if(typeof window.onload!='function'){
 	 	window.onload=func;
 	} else {
  		window.onload=function(){
 	  		if(oldonload) {
  				oldonload();
 			  }
 			  func();
 		 }
 	}
}

onloadAppend(marqueeInit);

CSS

.digit {
  float: left;
  width: 14px;
  height: 26px;
  margin-right: 2px;
  background: #000 url(ledmarquee.gif) 0px 0px;
}

#ledmarquee {
  height: 26px;
  visibility: hidden;
  background-color: #000;
}

HTML

<div id="ledmarquee">
Multi-<red>C<blue>o<yellow>l<green>o<red>r<green> JavaScript LED marquee - IE & FF compatible - <yellow>no fonts required<green>simply superb

Thanks to http://javascript.internet.com/text-effects/led-marquee.html

Related posts:

1. Displaying Text from User On Your Webpage
2. Check password strength using javascript
3. Replace all non alphanumeric characters using javascript
4. Calendar Script Using Javascript [Updated]
5. Javascript setTimeout() Tricks
6. Display Tags in wordpress
7. Context Right Click Menu Using Javascript