View Full Version : Autumn Leaves script modified by jscheuer

03-23-2014, 01:28 PM
1) Script Title: Autumn Leaves

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex3/leaves.htm

3) Describe problem: The modified script by jscheuer works fine as used on my website:


but the footer gets completely covered with the leaves and also I would request you to let me know how to insert specifically 7 balloons instead of leaves. Please note that this is for a birthday site & as such I am required to put only 7 balloons coming from top & resting above the footer so the footer can also be visible.
Thank you for your time & effort.

03-23-2014, 06:33 PM
Use balloon images instead of leaves and put this in the stylesheet for the page:

#footer {z-index: 1000;}

You might find this demo helpful:


Any other questions, just ask.

03-24-2014, 10:53 AM
Thank you for your prompt reply. I need the balloons to fall in a row like ABCDEFG (as say name of the person whose birthday it is) Though in your source code you mention 7 balloons there seem to be many more. Kindly note the specific requirement is 7 balloons & first A balloon should fall then B balloon & so on - is that possible? Also can you simplify & explain if I have to put the balloon images in a specific folder - you have done it in a more technically sophisticated way which I am unaware of - I see no image folder in your source code. Please note I am just a layman & not a pro & this site is just for a friend. The Z index worked fine & once again thank you for your time, effort & patience.

03-26-2014, 05:14 PM



03-27-2014, 07:01 AM
Thank you for your effort in trying to help me & you are almost there. But i want the balloons to stop so the message at the end should read HAPPY BIRTHDAY.because the page will have text & pic also & the continuous falling of the balloons might be irritating for viewers of the web page. Also how & where do i put the balloon images - i mean do i create a folder for images & insert the balloons there? - in your source code i see no such link to the images folder, kindly explain Thank you Sir.

03-27-2014, 03:07 PM
How about:


For the balloon images I made a folder called balloonimages and put them in there. Then referenced them in the code like so:

var gb = 'balloonimages/ballon', ge = '.gif'

and got them to count out with:

i = 7, ga = [];
while(--i){ga.push(gb + i + ge);}

(they are currently ballon1.gif through ballon6.gif)

If you look at the code on jqfallrise(balloons-3).htm, you will see the above is already there. I could have just made (written out) a literal Array.

I'll attach a zip of the images (right click and 'Save As'):


But you may make and/or find your own images. In fact, I was just playing around with this a bit more and it's more realistic and clen with solid balloons (the current live balloons are transparent where they show a 'reflection' of light). Here are the solid ones (they're still transparent outside the balloons):


Demo with solid images and another refinement (allowance for spaces in the text):


03-28-2014, 10:29 AM
Thank you! - you are truly the GOD of java scripts!!