Results 1 to 3 of 3

Thread: Autumn leaves - make them slower?

  1. #1
    Join Date
    Nov 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Autumn leaves - make them slower?

    Hi, I got this script from your site:

    Code:
    <script language="JavaScript1.2">
    
    //Autumn leaves- 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!
    grphcs=new Array(6)
    Image0=new Image();
    Image0.src=grphcs[0]="al.gif";
    Image1=new Image();
    Image1.src=grphcs[1]="bl.gif"
    Image2=new Image();
    Image2.src=grphcs[2]="cl.gif"
    Image3=new Image();
    Image3.src=grphcs[3]="dl.gif"
    Image4=new Image();
    Image4.src=grphcs[4]="el.gif"
    Image5=new Image();
    Image5.src=grphcs[5]="fl.gif" 
    
    Amount=8; //Smoothness depends on image file size, the smaller the size the more you can use!
    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.clientHeight;
    WinWidth=(ns||ns6)?window.innerWidth-70: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;
    }
    function fall(){
    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(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;
    }
    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,Xpos[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>
    They seem a bit fast and I wonder if there's any way to make the leaves to fall slower.

    I'd also like if the leaves wouldn't come all at once. It would be better if they'd come one after another.
    Thanks for your help

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    This upgrade:

    http://home.comcast.net/~jscheuer1/s...s_bidirect.htm

    though it currently features bubbles going up can show leaves going down, all configurable, along with various other things including speed.

    Use your browser's 'view source' to get the code.

    Here is an excerpt from the configuration section (you need the full script):

    Code:
    var dir=-1    // Set 'falling' direction (1 for down, -1 for up)
    var speed=60  // 12 to whatever (60 is pretty slow) higher numbers are slower
    var Amount=8; // Smoothness depends on image file size, the smaller the size the more you can use!
    var sway=10  // Set amount of left/right swaying of objects (default=10), higher numbers produce more sway
    
    //Pre-load your image(s) below!
    grphcs=new Array(6)
    Image0=new Image();
    Image0.src=grphcs[0]="bubble.gif";
    Image1=new Image();
    Image1.src=grphcs[1]="bubble.gif"
    Image2=new Image();
    Image2.src=grphcs[2]="bubble.gif"
    Image3=new Image();
    Image3.src=grphcs[3]="bubble.gif"
    Image4=new Image();
    Image4.src=grphcs[4]="bubble.gif"
    Image5=new Image();
    Image5.src=grphcs[5]="bubble.gif"
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Nov 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks a bunch.
    Is it somehow possible to have the leaves lay on the ground for a few seconds and then to get blown away by the wind?

    I'd also like to have the leaves only falling within a div container.
    Last edited by Lyon1; 11-08-2009 at 06:28 PM.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •