Menu
Community /Pin to ProfileBookmark
@cootheadJul 20.2009 — #Hi there lilbrodeur,
the reason that it does not work is that you are using an ancient script with an inappropriate dtd. :eek:
Here is your page very slightly modernised ?...
[i]coothead[/i]
[RESOLVED] Falling Leaves
Hi,
I’m trying to figure out why the leaves are not falling on the page. They show up at the top left corner, but they are not falling down the page like they’re supposed to. Can someone help, please? ?
Here’s the code:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“
<html xmlns=”
<head>
<title>Falling Leaves</title>
<body>
<script language=”JavaScript1.2″>
grphcs=new Array(6)
Image0=new Image();
Image0.src=grphcs[0]=”leaf1.gif”;
Image1=new Image();
Image1.src=grphcs[1]=”leaf2.gif”
Image2=new Image();
Image2.src=grphcs[2]=”leaf3.gif”
Image3=new Image();
Image3.src=grphcs[3]=”leaf4.gif”
Image4=new Image();
Image4.src=grphcs[4]=”leaf5.gif”
Image5=new Image();
Image5.src=grphcs[5]=”leaf6.gif”
Amount=8;
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;
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:window.document.body.clie
ntHeight;
WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.cli
entWidth;
for (i=0; i < Amount; i++){
Ypos[i] = Math.round(Math.random()*WinHeight);
Xpos[i] = Math.round(Math.random()
Speed[i]= Math.random()*5+3;
Cstep[i]=0;
Step[i]=Math.random()
}
function fall(){
var
WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clie
ntHeight;
var
WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.cli
entWidth;
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(90
sx = Speed[i]*Math.cos(Cstep[i]);
Ypos[i]+=sy;
Xpos[i]+=sx;
if (Ypos[i] > WinHeight){
Ypos[i]=-60;
Xpos[i]=Math.round(Math.random()
Speed[i]=Math.random()*5+3;
}
if (ns){
document.layers[‘sn’+i].left=Xpos[i];
document.layers[‘sn’+i].top=Ypos[i]+hscrll;
}
else if (ns6){
document.getElementById(“si”+i).style.left=Math.min(WinWidth,Xpo
s[i]);
document.getElementById(“si”+i).style.top=Ypos[i]+hscrll;
}
else{
eval(“document.all.si”+i).style.left=Xpos[i];
eval(“document.all.si”+i).style.top=Ypos[i]+hscrll;
}
Cstep[i]+=Step[i];
}
setTimeout(‘fall()’,20);
}
window.onload=fall
//–>
</script>
</body>
</head>
</html>
Sign in
to post a comment3 Comments(s) ↴
0
@cootheadJul 20.2009 — #Hi there lilbrodeur,the reason that it does not work is that you are using an ancient script with an inappropriate dtd. :eek:
Here is your page very slightly modernised ?...
[color=navy]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Falling Leaves</title>
<style type="text/css">
html,body {
height:100%;
margin:0;
padding:0;
}
.abs {
position:absolute;
top:0;
left:0
}
#content {
margin-top:20px;
color:#f00;
text-align:center;
}
</style>
<script type="text/javascript">
grphcs=new Array(6)
Image0=new Image();
Image0.src=grphcs[0]='leaf1.gif';
Image1=new Image();
Image1.src=grphcs[1]='leaf2.gif';
Image2=new Image();
Image2.src=grphcs[2]='leaf3.gif';
Image3=new Image();
Image3.src=grphcs[3]='leaf4.gif';
Image4=new Image();
Image4.src=grphcs[4]='leaf5.gif';
Image5=new Image();
Image5.src=grphcs[5]='leaf6.gif';
Amount=8;
Ypos=new Array();
Xpos=new Array();
Speed=new Array();
Step=new Array();
Cstep=new Array();
function init() {
for(i=0;i<Amount;i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.getElementById('si'+i).src=rndPic;
}
WinHeight=window.document.body.clientHeight;
WinWidth=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+3;
Cstep[i]=0;
Step[i]=Math.random()*0.1+0.05;
}
fall();
}
function fall(){
WinHeight=window.document.body.clientHeight;
WinWidth=window.document.body.clientWidth;
hscrll=document.body.scrollTop;
wscrll=document.body.scrollLeft;
for(i=0;i<Amount;i++){
sy=Speed[i]*Math.sin(90*Math.PI/180);
sx=Speed[i]*Math.cos(Cstep[i]);
Ypos[i]+=sy;
Xpos[i]+=sx;
if(Ypos[i]>WinHeight){
Ypos[i]=-60;
Xpos[i]=Math.round(Math.random()*WinWidth);
Speed[i]=Math.random()*5+3;
}
document.getElementById('si'+i).style.left=Math.min(WinWidth,Xpos[i])+'px';
document.getElementById('si'+i).style.top=Ypos[i]+hscrll+'px';
Cstep[i]+=Step[i];
}
setTimeout(function(){fall()},20);
}
if(window.addEventListener) {
window.addEventListener('load',init,false);
}
else {
if(window.attachEvent) {
window.attachEvent('onload',init);
}
}
</script>
</head>
<body>
<div id="leaves">
<img id="si0" class="abs" src="#" alt="">
<img id="si1" class="abs" src="#" alt="">
<img id="si2" class="abs" src="#" alt="">
<img id="si3" class="abs" src="#" alt="">
<img id="si4" class="abs" src="#" alt="">
<img id="si5" class="abs" src="#" alt="">
<img id="si6" class="abs" src="#" alt="">
<img id="si7" class="abs" src="#" alt="">
</div>
<div id="content">Page content should be placed in here</div>
</body>
</html>
[/color][i]coothead[/i]