Help With Flying Planes by John Ely

**hojo** · 12-12-2009, 06:15 PM

Finally found a flying image script that works with IE FF & Google Chrome.
I would like to be able to define the path but not being that well versed in Javascript I don't know what code to change or if this is even possible.

Any help in showing me how to code or define a fixed path would be greatly appreciated.

Below is the Flying Planes script.

Thank you!

Hojo

Code:

<head>


<script language="JavaScript1.2">

//Flying planes - by John Ely
//Modified from: Autumn leaves script- by Kurt Grigg (kurt.grigg@virgin.net)
//Modified by Dynamic Drive for NS6 functionality
//visit http://www.dynamicdrive.com for this script

//Pre-load your image below!
//CHANGE 5 to the number of images listed below
grphcs=new Array(2) 

//PRELOAD the involved images (extend or contract variables according to # of images used)
Image0=new Image();
Image0.src=grphcs[0]="arp.gif"
Image1=new Image();
Image1.src=grphcs[1]="grnpot.gif"


//SPECIFY number of images to randomly display concurrently from list above. Less the more efficient
Amount=2; 
Ypos=new Array();
Xpos=new Array();
Speed=new Array();
Step=new Array();
Cstep=new Array();
ns=(document.layers)?1:0;
ns6=(document.getElementById&&!document.all)?1:0;
ie=document.all

if (ns){
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");
}
}
else{
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
}
document.write('</div></div>');
}
WinHeight=(ns||ns6)?window.innerHeight-70:window.document.body.clientHeight;
WinWidth=(ns||ns6)?window.innerWidth:window.document.body.clientWidth;
for (i=0; i < Amount; i++){                                                                
 Ypos[i] = Math.round(Math.random()*WinHeight);
 Xpos[i] = Math.round(Math.random()*WinWidth);
 Speed[i]= Math.random()*5+1;
 Cstep[i]=0;
 Step[i]=Math.random()*0.1+0.05;
}
function fly(){
var WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;
var WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;
var hscrll=(ns||ns6)?window.pageYOffset:document.body.scrollTop;
var wscrll=(ns||ns6)?window.pageXOffset:document.body.scrollLeft;

for (i=0; i < Amount; i++){
sy = Speed[i]*Math.sin(Cstep[i]);
sx = Speed[i]*2;
Ypos[i]+=sy;
Xpos[i]+=sx; 
if (Xpos[i] > WinWidth){
Ypos[i]=Math.round(Math.random()*WinHeight);
Xpos[i]=-60;
Speed[i]=Math.random()*5+1;
}

if (ns){
document.layers['sn'+i].left=Xpos[i]+wscrll;
document.layers['sn'+i].top=Ypos[i];
}

else if (ns6){
document.getElementById("si"+i).style.left=Xpos[i]+wscrll;
document.getElementById("si"+i).style.top=Math.min(WinHeight,Ypos[i]);
}

else{
eval("document.all.si"+i).style.left=Xpos[i]+wscrll;
eval("document.all.si"+i).style.top=Ypos[i];
} 
Cstep[i]+=Step[i];
}
setTimeout('fly()',20);
}

if (ie||ns||ns6)
window.onload=fly
//-->
</script>

</html>

**jscheuer1** · 12-13-2009, 03:15 PM

Just for your information, this script will probably fail in most browsers if the page has a valid URL DOCTYPE. That said, what path? If you mean the path to the images, it may be entered here (and similar):

Code:

Image0.src=grphcs[0]="images/arp.gif"

That's a relative path. It would be relative to the page using the script. If you make the script external and use the same external script on different pages in different folders, a relative path might not be suitable.

But if the script is installed directly on the page, as per the demo page's instructions, a relative path would be fine.

Basically though, if on the page you could have:

Code:

<img src="images/arp.gif" alt="">

If that would work, it will work in the script too (as shown at the top of this post). So any valid src attribute for an image tag that would work on the page will work in the script.

**hojo** · 12-13-2009, 09:28 PM

Thanks for the reply but what I want to be able to do is define the path that the images take as they move across the screen.

I want first of all to change the direction of the image movement from left to right to right to left if possilbe. I would also like to confine the movement of the images to the lower 1/4 area of the screen. I don't want the random movement of the images

Hope this clarifies what I am trying to accomplish.

Thanks

Hojo

**hojo** · 12-18-2009, 03:19 AM

OK, I finally figuired out how to control the path of the various images.

Thanks to one and all!

Hojo

Thread: Help With Flying Planes by John Ely

Thread Tools

Search Thread

Help With Flying Planes by John Ely

Bookmarks

Bookmarks

Posting Permissions