Okay, here's how you do it (this example fades text in from a white background to black text)
Put this in the <head> section of your page
<script language="Javascript">
//First, define an array to hold all your colors
colors=new Array();
colors[0]="#FFFFFF";
colors[1]="#EEEEEE";
colors[2]="#CCCCCC";
colors[3]="#999999";
colors[4]="#666666";
colors[5]="#333333";
colors[6]="#000000";
//some utility variables
var colorIndex = 0;
var text = null;
var timerFade = null;
var browserName = navigator.appName;
var browserVersion = parseInt(navigator.appVersion.substring(0,1));
//this only works with IE 4 and up
var dhtml = ((browserName == "Microsoft Internet Explorer"
&& (browserVersion > 3));
if (dhtml){
text = document.all("lyrics1"
;
LyricsFadeIn();
timerFade = setInterval("LyricsFadeIn()", 75);
}
//functions gradually changes the color
function LyricsFadeIn(){
text.style.color = colors[colorIndex];
colorIndex++;
if (colorIndex > 6) clearInterval(timerFade);
}
</script>
Then, where you have your lyrics in the body:
<span id="lyrics1">
There once was a girl from Nantucket...
</span>
And that's it. Of course, that'll only fade one piece of text into the page. If you want to do multiple texts, you'll just have to modify a couple things.
Facebook
Twitter