View Full Version : Falling snow on background
Reverend
Sat 7th Dec '02, 8:54am
I have noticed on some boards that they have animated snow falling over the background.Where do i need to add the code for the snow image (see attachment).
Thanks.
nemesis01
Sat 7th Dec '02, 10:54am
Think it's probably one of those javascripts which would go in the header.
DirectPixel
Sat 7th Dec '02, 1:08pm
Originally posted by nemesis01
Think it's probably one of those javascripts which would go in the header. No. All you need to do is add this to your body tag:
background="snow.gif"
madhouse
Tue 10th Dec '02, 11:21am
Originally posted by DirectPixel
No. All you need to do is add this to your body tag:
background="snow.gif"
I tried this but becuase I am already using an Image for the background it is not working.
Is there any way to keep my background and add this additional back ground?
DirectPixel
Tue 10th Dec '02, 6:36pm
Originally posted by madhouse
I tried this but becuase I am already using an Image for the background it is not working.
Is there any way to keep my background and add this additional back ground? Yes. Make a table that stretches 100% wide and 100% high, and use CSS to set that table's opacity to about 50%, and set the image as its background.:)
Flup
Wed 11th Dec '02, 1:09pm
Originally posted by DirectPixel
Yes. Make a table that stretches 100% wide and 100% high, and use CSS to set that table's opacity to about 50%, and set the image as its background.:) It's nice on a background.
But mayB 2 heavy for our 56k users :)
RavenBeauty
Mon 16th Dec '02, 1:05am
[QUOTE] Originally posted by Flup
It's nice on a background.
But mayB 2 heavy for our 56k users :) [/QUOTE
I hate to be a dummy but could you be more detailed? Are you saying that one can have two backgrounds working on one page? THAT is something I have been trying to figure out for some time now!
Flup
Mon 16th Dec '02, 11:52am
Originally posted by RavenBeauty
[QUOTE] Originally posted by Flup
It's nice on a background.
But mayB 2 heavy for our 56k users :) [/QUOTE
I hate to be a dummy but could you be more detailed? Are you saying that one can have two backgrounds working on one page? THAT is something I have been trying to figure out for some time now! Could be working.
1 colored background and 1 image background in .GIF format. But I don't think all browsers reconize this.
madhouse
Mon 16th Dec '02, 1:03pm
Originally posted by Flup
Could be working.
1 colored background and 1 image background in .GIF format. But I don't think all browsers reconize this.
I got it to work with a color back ground then the snow image
example: <body background="/forum/images/snow.gif" bgcolor="#636262" text="#ffffff" ETC...
This would be for the Body Tag.
---------------------------------
#636262" background="/forum/images/snow.gif
This would be for the page background color.
Menno
Fri 20th Dec '02, 2:33pm
It's 5k, I really don't think modem users will be bothered much by it. And as for setting it as background: if you already use a background image, the only option is to put your entire layout into a 100% streched table. Set the background of the table to the snow image, and you'll have a snow background that overlaps your own background (thanks to good old gif transparency).
You could also try to create an animated gif that has your own background with the snow added to it. It's a question of preference I suppose.
SnowBlizZ
Sun 22nd Dec '02, 4:58pm
Snow Flakes here:
http://www.dynamicdrive.com/dynamicindex3/snow.htm
Rain here:
http://www.dynamicdrive.com/dynamicindex3/rain.htm
Bubbles here:
http://www.dynamicdrive.com/dynamicindex3/bubble.htm
MORE SNOW FLAKES
This one doesn't use images!!
<head>
<script language="javascript">
//Rain/Snow effect- By Craig Blanchette Craiga.topcities.com
//Script featured on Dynamic Drive
//Visit http://www.dynamicdrive.com for this script and more
snow = true; // false-rain; true-snow
snowsym = " * " //These are the symbols for each
rainsym = " ' " //You can put images here.
howmany = 10 //How many drops/snowflakes?
/**************Do not need to change anything below***********/
if(snow){sym = snowsym; speed=1; angle=10; drops=howmany}
else{sym = rainsym; speed=50; drops=howmany; angle=6}
movex = -speed/angle; movey = speed; count = 0;
function moverain(){
for(move = 0; move < drops; move++){
xx[move]+=movex; yy[move]+=mv[move];
hmm = Math.round(Math.random()*1);
if(xx[move] < 0){xx[move] = maxx+10;}
if(yy[move] > maxy){yy[move] = 10;}
drop[move].left = xx[move]
drop[move].top = yy[move]+document.body.scrollTop;
}setTimeout('moverain()','1')}
</script>
</head>
<body bgcolor="#000000" text="#FFFFFF">
<script language="javascript">
if (document.all){
drop = new Array(); xx = new Array(); yy = new Array(); mv = new Array()
ly = "document.all[\'"; st = "\'].style"
for(make = 0; make < drops; make++){
document.write('<div id="drop'+make+'" class=drop>'+sym+'</div>');
drop[make] = eval(ly+'drop'+make+st);
maxx = document.body.clientWidth-40
maxy = document.body.clientHeight-40
xx[make] = Math.random()*maxx;
yy[make] = -100-Math.random()*maxy;
drop[make].left = xx[make]
drop[make].top = yy[make]
mv[make] = (Math.random()*5)+speed/4;
drop[make].fontSize = (Math.random()*10)+20;
if(snow){col = 'white'}else{col = 'blue'}
drop[make].color = col;
}
window.onload=moverain
}
</script>
</body>
How this helps u guys out can someone help me out with a tight style :-)
SnowBlizZ
Sun 22nd Dec '02, 5:04pm
I like the one that doesn't use images it doesn't make the page scroll. :D:D
Powered by vBulletin™ Version 4.0.0 Beta 2 Copyright © 2009 vBulletin Solutions, Inc. All rights