<!-- This script has been in the http://www.javascripts.com Javascript Public Library! -->
<!-- Note that though this material may have been in a public depository, certain author copyright restrictions may apply. -->
<html>
<head><title>Test</title>
<script language="JavaScript">
<!--
/* Flying Text Screen Script by Sunil Gopalan <sunilgopalan@letterboxes.org> */
/* Please retain this header if you use this script on your site. */
/* I would appreciate an email with the url where you are using the script */
/* This script requires version 4+ browsers to function.. It works best on */
/* MSIE 4+.. NetScape users will miss out some effects and might have a less*/
/* smooth experience. However it will work on NetScape as well */
/*--------------------------------------------------------------------------*/
/* Please enter the configuration variables below to customise this script */
//Enter message to be flashed on the screen below. The message will be split up
//into individual words i.e. each word will appear separately.
//If you desire a group of words to appear together, please separate them using
//the code instead of the usual blank. This code is the html equivalent
//of a blank space.
var message = "Welcome to the JavaScripts.com text Screen";
//After the flying text show, what do you want to be seen on the screen..
//Enter in the variable below.. You might enter HTML in the variable below
//but beware that no " symbols can be used in the HTML.. use ' instead.
var finalmessage = "<font size='5'><b>Javascripts.com</b></font><p align='left'><font size='3'><b>Script Name:</b> Flying Text Screen<br><br><b>Author:</b> Sunil Gopalan <sunilgopalan@letterboxes.org><br><br><b>Requirements:</b> MSIE 4+ or NetScape 4+<br><br><b>Description:</b>This script takes a sentence and floats the words across the screen in multiple text blocks. This is typically meant for the opening screen of a website or part thereof. The script ends with the page contents showing up. <br><br>You will miss out on some of the effects with NetScape. This is because of the implementation of DHTML in NetScape.<br><br> The script provides for a high level of customisability for use even if you do not know much of JavaScript. All you need to do is save this page to your hard disk and edit the variables on the top of the script to generate your own spectacular flying text screen. The flying paths are generated randomly.. so it will be different each time you view it. <i>The author would appreciate any comments, suggestions and queries at the email address on top.</i></font></p>";
/*--------------------------------------------------------------------------*/
/*The rest of the variables need to be modified only optionally*/
//Enter number of flying text blocks per word .. maximum value is 10
//However, the more you increase this value, the more jerky the flying movement
//becomes.. Keep this in mind
var noOfFlyers = 10;
//Enter color of each of the flying text blocks below
//You can choose from white, red, green and blue
//Note that the list of colors must be of length equal to the number of flying
//text blocks set above.
var blkCol = new Array("white","blue","red","green","white","blue","white","blue","red","green");
//Enter font of each of the flying text blocks below
//You can choose any font but it is advisable that you stick to the common
//ones - timesroman, arial, courier, verdana etc..
//Again, list length must equal number of text blocks
var blkFont = new Array("arial","timesroman","courier","verdana","timesroman","courier","arial","timesroman","courier","verdana");
//Enter the font sizes of each of the flying text blocks below
//Enter any integral values.. I recommend between 22-30
//Again, list length must equal number of text blocks
var blkSize = new Array("22","14","10","28","29","10","22","24","26","10");
//Enter whether you want to italicize any of the text blocks.. Enter 1 for yes
//and 0 for no. Any block with value 1 will be italicised
//Again, list length must equal number of text blocks
var blkIt = new Array("0","0","1","0","1","0","0","1","0","0");
/*--------------------------------------------------------------------------*/
/*Do not modify the script below unless you know what you are doing*/
var ie=document.all?1:0
var ns=document.layers?1:0
var err = 0;
var msgI=1;
var noOfMsgs;
function initialize()
{
if(!ns&&!ie) {
document.writeln("<center>"+finalmessage+"</center>");
document.writeln("<P><P><font face='arial' size=2>You are missing out on all the coolest stuff because of your outdated browser. Upgrade soon.</font>");
err=1;
return;
}
if(noOfFlyers<1||noOfFlyers>10) {handleErr("The number of flying blocks has been assigned an invalid value. Script will terminate.");return}
if(blkCol.length!=noOfFlyers) {handleErr("The list of block colours has an invalid length. Script will terminate.");return}
if(blkFont.length!=noOfFlyers) {handleErr("The list of block fonts has an invalid length. Script will terminate.");return}
if(blkSize.length!=noOfFlyers) {handleErr("The list of block font sizes has an invalid length. Script will terminate.");return}
self.moveTo(0,0);
self.resizeTo(screen.width,screen.height);
var msg = new String(message);
aOMsgs = msg.split(" ");
noOfMsgs = aOMsgs.length+1;
for(var i = 0; i<aOMsgs.length; i++)
{
for(var j = 1; j<=noOfFlyers; j++)
{
if(ie) document.writeln("<div id=\"fly"+String((i*noOfFlyers)+j)+"\" class=\"fly"+String(j)+"\" style=\"visibility:hidden\">"+aOMsgs[i]+"</div>");
if(ns) document.writeln("<layer id=\"fly"+String((i*noOfFlyers)+j)+"\" class=\"fly"+String(j)+"\" visibility=\"hidden\">"+aOMsgs[i]+"</layer>");
}
}
if(ie) document.write("<div id=\"mesg\" style=\"position:relative;color:black;visibility:hidden;font-family:arial;\"><center>"+finalmessage+"</center></div>");
if(ns) document.write("<layer id=\"mesg\" class=\"mesg\" visibility=\"hidden\"><center>"+finalmessage+"</center></layer>");
}
var msgCol=0;
function stop_flying()
{
if(ie){
document.all.mesg.style.visibility="visible";
document.all.mesg.style.color="rgb("+String(msgCol)+","+String(msgCol)+","+String(msgCol)+")";
}
if(ns){
setTimeout("document.layers['mesg'].visibility='visible'",1000);
return;
}
msgCol+=10;
if(msgCol<256) setTimeout("stop_flying()",10);
else return;
}
function fly_txt(dataID)
{
this.objID = dataID;
var screen_x = screen.width;
var screen_y = screen.height;
var window_x = 0.9*screen_x;
var window_y = 0.6*screen_y;
var x;
x=0.6*Math.random();
if(x>0.3) x+=0.4;
this.start_x = Math.round(window_x*x);
this.start_y = Math.round(window_y*Math.random());
if(x>0.3) x=0.3*Math.random();
else x=0.7+0.3*Math.random();
this.stop_x = Math.round(window_x*x);
this.stop_y = Math.round(window_y*Math.random());
this.slope = (this.stop_y - this.start_y)/(this.stop_x - this.start_x);
this.speed = Math.round(Math.random()*2)+4;
if(ns) this.speed-=2;
this.steps = Math.round(Math.abs(this.start_x-this.stop_x)/this.speed);
this.curCol = 0;
this.curI = 0;
this.timerID = 0;
if(ie) this.objStyle = eval("document.all(\""+this.objID+"\").style");
if(ns) this.objStyle = eval("document.layers[\""+this.objID+"\"]");
var tmp = (parseInt(dataID.substring(3))-1)%noOfFlyers;
if(ie) {
this.color=blkCol[tmp];
this.objStyle.fontFamily=blkFont[tmp];
this.objStyle.fontSize=blkSize[tmp]+"pt";
this.objStyle.fontStyle=(parseInt(blkIt[tmp])?"italic":"normal");
}
this.Animate = animate_fly;
}
function animate_fly()
{
if(ie){
this.objStyle.pixelLeft = this.start_x+this.curI;
this.objStyle.pixelTop = (this.slope*this.curI) + this.start_y;
}
if(ns){
this.objStyle.left = this.start_x+this.curI;
this.objStyle.top = (this.slope*this.curI) + this.start_y;
}
this.objStyle.visibility="visible";
if(this.stop_x>this.start_x) this.curI+=this.speed;
else this.curI-=this.speed;
if(ie){
var tmp;
switch(this.color){
case "white":
tmp=String("rgb("+String(this.curCol)+","+String(this.curCol)+","+String(this.curCol)+")");
break;
case "red":
tmp=String("rgb("+String(this.curCol)+",0,0)");
break;
case "blue":
tmp=String("rgb(0,0,"+String(this.curCol)+")");
break;
case "green":
tmp=String("rgb(0,"+String(this.curCol)+",0)");
break;
default:
}
this.objStyle.color=tmp;
if(this.steps>50){
if(Math.abs(this.curI/this.speed)<25) this.curCol+=10;
if(Math.abs(this.curI/this.speed)>(this.steps-25)) this.curCol-=5;
}
}
if(Math.abs(this.start_x+this.curI-this.stop_x)<=this.speed) {
clearInterval(this.timerID);
this.timerID=0;
this.objStyle.visibility="hidden";
var end=0;
for(var i=1; i<=noOfFlyers; i++)
if(fly[i].timerID) end=1;
if(!end)
if(msgI<noOfMsgs) start_flying(msgI++);
else stop_flying();
}
}
var fly = new Array(11);
function start_flying(msgIndex)
{
if(err) return;
for(var s=1; s<=noOfFlyers; s++)
{
fly[s] = new fly_txt("fly"+String((msgIndex-1)*noOfFlyers+s));
}
for(s=1;s<=noOfFlyers;s++)
{
var cmd = "fly["+s+"].Animate()";
fly[s].timerID = setInterval(cmd,10);
}
}
function handleErr(errMsg)
{
alert(errMsg);
err=1;
return false;
}
//-->
</script>
<style type="text/css">
<!--
.fly1 {position:absolute;font-family:arial;font-size:22pt;font-weight:bold;color:white;}
.fly2 {position:absolute;font-family:timesroman;font-size:24pt;font-weight:bold;color:white;}
.fly3 {position:absolute;font-family:gothic;font-size:26pt;font-weight:bold;color:white;}
.fly4 {position:absolute;font-family:arial;font-size:28pt;font-weight:bold;color:white;}
.fly5 {position:absolute;font-family:courier;font-size:29pt;font-weight:bold;color:white;}
.fly6 {position:absolute;font-family:arial;font-size:22pt;font-weight:bold;color:white;}
.fly7 {position:absolute;font-family:timesroman;font-size:20pt;font-weight:bold;color:white;}
.fly8 {position:absolute;font-family:gothic;font-size:22pt;font-weight:bold;color:white;}
.fly9 {position:absolute;font-family:arial;font-size:24pt;font-weight:bold;color:white;}
.fly10 {position:absolute;font-family:courier;font-size:25pt;font-weight:bold;color:white;}
.mesg {position:relative;color:white;font-family:arial;}
-->
</style>
<style type="text/javascript">
for(var k = 1; k<=noOfFlyers; k++){
document.classes["fly"+String(k)].all.color=blkCol[k-1];
document.classes["fly"+String(k)].all.fontFamily=blkFont[k-1];
document.classes["fly"+String(k)].all.fontSize=blkSize[k-1]+"pt";
document.classes["fly"+String(k)].all.fontStyle=(parseInt(blkIt[k-1])?"italic":"normal");
}
</style>
</head>
<body bgcolor="#000000" text="#ffffff" onLoad="start_flying(msgI++)">
<script language = "JavaScript">
<!--
initialize();
//-->
</script>
</body>
</html>