Scribd
Upload
264 views3 pages

The Script

This document contains a JavaScript script that creates falling leaf animations on a web page. The script preloads image files of leaf pictures, then dynamically inserts HTML elements with the leaf images into the page using document.write. It sets the initial position of each leaf randomly. A fall() function is called repeatedly using setTimeout to update the leaf positions, making them appear to fall down the page over time based on sinusoidal movement. The script stops the animation after a set number of seconds by hiding all the leaf elements.

Uploaded by

api-3761860
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
264 views3 pages

The Script

This document contains a JavaScript script that creates falling leaf animations on a web page. The script preloads image files of leaf pictures, then dynamically inserts HTML elements with the leaf images into the page using document.write. It sets the initial position of each leaf randomly. A fall() function is called repeatedly using setTimeout to update the leaf positions, making them appear to fall down the page over time based on sinusoidal movement. The script stops the animation after a set number of seconds by hiding all the leaf elements.

Uploaded by

api-3761860
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

<!

--
paste script as last thing in body. make sure leaf pics are in same
directory/folder as web page using the script. if pics are put in a
separate folder, you will have alter all script references to them.
-->

<script language="javascript">
<!-- fall script kurt grigg - http://www.btinternet.com/~kurt.grigg/javascript

var isnetscape6=false;
if (navigator.appname == "netscape" && parsefloat(navigator.appversion) >= 5)
isnetscape6=true;

/*
this script has been disabled for
netscape 6 due to ugly scrollbar
activety. could probably be fixed
with a clipped container div but
can't be bothered.
*/

if (!isnetscape6){
num=15; //smoothness depends on image file size, the smaller the size the more you
can use!
stopafter=30; //seconds!

//pre-load images!
pics=new array("al.gif","bl.gif","cl.gif","dl.gif","el.gif","fl.gif");
load=new array();
for(i=0; i < pics.length; i++){
load[i]=new image();
load[i].src=pics[i];
}
stopafter*=1000;
timer=null;
y=new array();
x=new array();
s=new array();
s1=new array();
s2=new array();
if (document.layers){
for (i=0; i < num; i++){
randomleaf = pics[math.floor(math.random()*pics.length)];
document.write("<layer name='leaf"+i+"' left=0 top=0><img
src="+randomleaf+"></layer>");
}
}
if (document.all){
document.write('<div style="position:absolute;top:0px;left:0px"><div
style="position:relative">');
for (i=0; i < num; i++){
randomleaf = pics[math.floor(math.random()*pics.length)];
document.write('<img id="leaf'+i+'" src="'+randomleaf+'"
style="position:absolute;top:0px;left:0px">');
}
document.write('</div></div>');
}
if (!document.all&&!document.layers){
for (i=0; i < num; i++){
randomleaf = pics[math.floor(math.random()*pics.length)];
document.write("<div id='leaf"+i+"'
style='position:absolute;top:0px;left:0px'><img src="+randomleaf+"></div>");
}
}
inih=(document.all)?window.document.body.clientheight:window.innerheight-100;
iniw=(document.all)?window.document.body.clientwidth:window.innerwidth-100;
for (i=0; i < num; i++){

y[i]=math.round(math.random()*inih);
x[i]=math.round(math.random()*iniw);
s[i]=math.random()*5+3;
s1[i]=0;
s2[i]=math.random()*0.1+0.05;
}
function fall(){
h=(document.all)?window.document.body.clientheight:window.innerheight;
w=(document.all)?window.document.body.clientwidth:window.innerwidth;
scy=(document.all)?document.body.scrolltop:window.pageyoffset;
scx=(document.all)?document.body.scrollleft:window.pagexoffset;
for (i=0; i < num; i++){
sy=s[i]*math.sin(90*math.pi/180);
sx=s[i]*math.cos(s1[i]);
y[i]+=sy;
x[i]+=sx;
if (y[i] > h){
y[i]=-60;
x[i]=math.round(math.random()*w);
s[i]=math.random()*5+3;
}
s1[i]+=s2[i];
if (document.layers){
document.layers["leaf"+i].left=x[i];
document.layers["leaf"+i].top=y[i]+scy;
}
else{
document.getelementbyid("leaf"+i).style.left=x[i];
document.getelementbyid("leaf"+i).style.top=y[i]+scy;
}
}
timer=settimeout('fall()',20);
}
fall();

function dsbl(){
for (i=0; i < num; i++){
if (document.layers)
document.layers["leaf"+i].visibility="hide";
else
document.getelementbyid("leaf"+i).style.visibility="hidden";
}
cleartimeout(timer);
}
settimeout('dsbl()',stopafter);
}
//-->
</script>

You might also like