<script language="JavaScript">
/*This script is made by bratta at www.bratta.com and can be used freely
as long as this msg is instact. I would appriciate any links to my page.
########################################################################
########################################################################
########################################################################
If you want the text to appear differently on anothe place on the page
or anything set that in the style tag of the zoom layer. 

Here are the variables you have to set:									


First the text: (it will stop and fade/change the colors on the last one)*/


	text=new Array('Welcome to','JavaScript','Resources!','JavaScript Resources')


//set the number of text's


	var numText=4


//Now the colors:


//all you have to do is set the color you want to have in here: 


//(the first color will be the color that the text is when it zooms.)


	color=new Array('#000099','#0066ff','#00ccff','#00ffff','#ccffff')


//set the number of colors:


	var numColors=5

//set the size you want the zoom to end at:

	var endSize=52

//Set the speed you want it to zoom in (in milliseconds)
	var Zspeed=200

//Set the speed you want it too change colors in
	var Cspeed=250

//Set font

	var font='Arial, Helvetica'

//do you want it to hide when its done? (true or false)

	var hide=true

/*You shouldn't really have to set anything below this point


######################################################################

######################################################################

######################################################################*/


var size=10


var gonum=0


/*Browsercheck and settings vars


######################################################################*/


if (document.all) {


		n=0


		ie=1


		zoomText='document.all.zoom.innerText=text[num]'


		zoomSize='document.all.zoom.style.fontSize=size'


		closeIt=""


		fadeColor="document.all.zoom.style.color=color[num]"


	}


if (document.layers) {


		n=1;ie=0


		zoomText=""


		zoomSize="document.zoom.document.write('<p align=\"center\" style=\"font-family:'+font+'; font-size:'+size+'px; color:'+color[0]+'\">'+text[num]+'</p>')"


		closeIt="document.zoom.document.close()"


		fadeColor="document.zoom.document.write('<p align=\"center\" style=\"font-family:'+font+'; font-size:'+endSize+'px; color:'+color[num]+'\">'+text[numText-1]+'</p>')"


	}





/*The functions for zooming text.


####################################################################*/


function zoom(num,fn){


	if (size<endSize){


		eval(zoomText)


		eval(zoomSize)


		eval(closeIt)


   		size+=5;


		setTimeout("zoom("+num+",'"+fn+"')",Zspeed)


	}else{


	 	eval(fn);


	}


}


/*The functions for fading/changing colors on text


####################################################################*/


function fadeIt(num){


	if (num<numColors){


		eval(fadeColor)


		eval(closeIt)


   		num+=1;


		setTimeout("fadeIt("+num+")",Cspeed)


	}else{


		hideIt()


	}


}


/*This is the function that hides the layer after the zoom/color change


####################################################################*/


function hideIt(){


	if(hide){


		if(ie)document.all.zoom.style.visibility="hidden"


		if(n)document.layers.zoom.visibility="hidden"


	}


}


/*This is the functions that calls the right function...or something :}


####################################################################*/


function init(){


	if(ie){


		document.all.zoom.style.color=color[0]


		document.all.zoom.style.fontFamily=font}


	go(0)	


}


function go(num){


	gonum+=1


	size=10


	if(num<numText){


		zoom(num,'go('+gonum+')')


	}else{


		fadeIt(0)


	}


}


//####################################################################
// -->
</script>
<body onload="init()">
<center><h1>Zooming Text</h1></center>
<div id="zoom" align="center" style="position:absolute; top:150">Welcome to JavaScript Resources</div>
<div id="footer+text" style="position: absolute; left: 10; top: 230"><layer name="footer+text" left=10 top=230>
<p>Here's another way of presenting animated titles. Not only does the text appear to zoom in, the final line fades out, instead of repeating as in the previous example. The script can easily be amended to leave the last line visible and static, if desired, though. This would be ideal on an entry page to a site.</p><hr><p>Script by: <a href="http://www.bratta.com/">bratta</a>.</p>