PDA

View Full Version : Forum Display Enhancements - Snowflakes for your forum

ChU v2
12-03-2007, 10:00 PM
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.


<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>


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.


<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>


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] (https://vborg.vbsupport.ru/showthread.php?t=162524)

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.
iogames
12-04-2007, 10:00 AM
Lik-it! :D
69lakalle
12-04-2007, 05:38 PM
nice isntalled !!
aspen1018
12-05-2007, 10:12 PM
how do you get them in the middle

thanks
ChU v2
12-06-2007, 12:10 AM
@Aspen:


Adjust:


left:200px
PCA Forums
12-07-2007, 06:42 AM
Anyone wanna post the code that goes all over the board so I dont have to change a bunch of numbers :D
ChU v2
12-08-2007, 03:33 AM
Anyone wanna post the code that goes all over the board so I dont have to change a bunch of numbers :D

Updated.
onestopadam
12-11-2007, 01:57 PM
where's snow.gif?
nyunyu
12-11-2007, 02:14 PM
@onestopadam, right click on the snow above, and save it as snow.gif
ChU v2
12-11-2007, 06:50 PM
It's the screenshot.
Konstantinos
12-11-2007, 07:46 PM
but why dont they go down to the footer and how to ??
ChU v2
12-13-2007, 04:45 AM
but why dont they go down to the footer and how to ??

Adjust the top:20px;

to however far you want it to go down.
MotMann
12-15-2007, 12:52 PM
My snowflakes dont faling down to the footer. Only in the header...
princeedward
12-16-2007, 12:04 AM
thanks for this one...nice christmas spirit idea...:rolleyes:


My snowflakes dont faling down to the footer. Only in the header...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! (http://epaloids.com/index.php)

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

snowballs 15x15
73222
snowballs_small 10x10
73223
MotMann
12-16-2007, 09:37 AM
what i must do, that the flakes comes down over the browserwindow with and High? Something with 100 % ?
princeedward
12-16-2007, 11:22 AM
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...


<marquee behavior="scroll" direction="down" scrollamount="2" style="position:absolute; left:15px; top:20px; width:25px; height:320px; z-index:1;"><span class="snowflakes"><img src="$stylevar[imgdir_misc]/snow.gif"></span></marquee>

goodluck and best regards....

;)
Robert Paulson
12-23-2007, 01:52 AM
I need to shift the whole pattern to the left a bit. How can I do that?

Here's the board (http://www.audioandanarchy.com/).

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
Robert Paulson
12-23-2007, 01:54 AM
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?
Robert Paulson
12-23-2007, 02:20 AM
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!!!!
Keesa
12-24-2007, 10:12 PM
I love it!!!

If you want to see...

http://www.tokiohotelamerica.com/forum

THANK YOU! Marked as installed.
ChU v2
01-02-2008, 05:47 PM
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?

Sure, just replace the image.
Hornstar
11-07-2008, 09:11 PM
I suppose with Christmas time coming up again, this might get used again.