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.
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.
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:Originally posted by nemesis01
Think it's probably one of those javascripts which would go in the header.
background="snow.gif"
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?
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.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?
It's nice on a background.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.
But mayB 2 heavy for our 56k users
[QUOTE] Originally posted by Flup
It's nice on a background.
But mayB 2 heavy for our 56k users
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!
[QUOTE] Originally posted by RavenBeauty
Could be working.Originally posted by Flup
It's nice on a background.
But mayB 2 heavy for our 56k users
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!
1 colored background and 1 image background in .GIF format. But I don't think all browsers reconize this.
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.
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.
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 :-)
I like the one that doesn't use images it doesn't make the page scroll.
Reply With Quote
Bookmarks