Snowflakes for your forum
 

This little hack uses an HTML marquee to add snowflakes to your header template. It is fully customizable unlike the java one I have seen on this forum.

https://vborg.vbsupport.ru/external/2008/04/6.gif

Instructions:

- Upload snow.gif to /forum/images/SKIN/misc

- Check snowflakes.txt for instructions

---------------------

TO ADD MORE SNOW AND ADJUST POSITION.

Add this code under the rest of the code.

NOTE: THAT CODE IS FOR ONE SNOWFLAKE! KEEP REPEATING THE CODE TO ADD MORE.

- To adjust the snowflakes position, adjust "left" and "top" option shown in green below. To adjust the speed of the snowflake adjust the "scrollamount" shown in red below.

Add the code multiple times and adjust the options to get an awesome snowfall! It is a bit time consuming but it's worth it!

For a skin with this code used check here: [Winter Snowfall]

Updates:

v2: Did the code to get most users started on it. Instead of having to do ALL of the code, most of it is written for you.

Lik-it! :D

nice isntalled !!

how do you get them in the middle

thanks

@Aspen:


Adjust:

Anyone wanna post the code that goes all over the board so I dont have to change a bunch of numbers :D

Updated.

where's snow.gif?

@onestopadam, right click on the snow above, and save it as snow.gif

It's the screenshot.

but why dont they go down to the footer and how to ??

Adjust the to however far you want it to go down.

My snowflakes dont faling down to the footer. Only in the header...

thanks for this one...nice christmas spirit idea...:rolleyes:


all i know is you have to adjust the height: not the top: coz' top setting is the horizontal line position of all snowflakes images..

:p

i add snowballs gif image also to my site...
Please View It Here!

for much better look...if someone interested...i attach my images below...

snowballs 15x15
Attachment 73222
snowballs_small 10x10
Attachment 73223

what i must do, that the flakes comes down over the browserwindow with and High? Something with 100 % ?

adjust the numbers of height... eg: height:1000px for a test ...and look where it goes disappear...adjust more...until it reach your forum footer...


goodluck and best regards....

;)

I need to shift the whole pattern to the left a bit. How can I do that?

Here's the board.

And here's the header template:

<!-- Snowflakes -->
<marquee behavior="scroll" direction="down" scrollamount="3" style="position:absolute; left:200px; top:20px; width:25px; height:230px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="1" style="position:absolute; left:250px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="7" style="position:absolute; left:300px; top:20px; width:25px; height:230px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="2" style="position:absolute; left:350px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="4" style="position:absolute; left:400px; top:20px; width:25px; height:230px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:450px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="3" style="position:absolute; left:500px; top:20px; width:25px; height:215px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="1" style="position:absolute; left:550px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="2" style="position:absolute; left:600px; top:20px; width:25px; height:215px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="6" style="position:absolute; left:650px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:700px; top:20px; width:25px; height:215px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="4" style="position:absolute; left:750px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="6" style="position:absolute; left:800px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="2" style="position:absolute; left:850px; top:20px; width:25px; height:215px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="3" style="position:absolute; left:900px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="7" style="position:absolute; left:950px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="1" style="position:absolute; left:1000px; top:20px; width:25px; height:215px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="3" style="position:absolute; left:1050px; top:10px; width:25px; height:251px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>
<!-- / Snowflakes -->
<!-- logo -->
<a name="top"></a>
<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="$stylevar[left]"><a href="$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>
<td align="$stylevar[right]">
&nbsp;
</td>
</tr>
</table>
<!-- /logo -->

<!-- content table -->
$spacer_open

$_phpinclude_output

Whoa. This could be awesome!

I can think of no reason why I couldn't have bombs or turkeys falling from the sky, too. Right?

Nevermind. This is AWESOME!!!!

I love it!!!

If you want to see...

http://www.tokiohotelamerica.com/forum

THANK YOU! Marked as installed.

Sure, just replace the image.

I suppose with Christmas time coming up again, this might get used again.