Forum Display Enhancements - Classic Style Snow Fall

This will give your site a classic holiday snow fall without any images, uploading any files, or adding any server load to your site.

It is also customize-able to fit your needs.


Classic Snow Fall

In your footer at the very end and below any other scripts you may already have there.

Add the following

<SCRIPT type="text/javascript">
/*
Classic Snow Fall - Java Script
*/

// Set the number of snowflakes (more than 30 - 40 not recommended)
var snowmax=35

// Set the colors for the snow. Add as many colors as you like
var snowcolor=new Array("#aaaacc","#ddddff","#ccccdd","#f3f3f3","#f0ffff")

// Set the fonts, that create the snowflakes. Add as many fonts as you like
var snowtype=new Array("Times","Arial","Times","Verdana")

// Set the letter that creates your snowflake (recommended: * )
var snowletter="*"

// Set the speed of sinking (recommended values range from 0.3 to 2)
var sinkspeed=0.6

// Set the maximum-size of your snowflakes
var snowmaxsize=30

// Set the minimal-size of your snowflakes
var snowminsize=8

// Set the snowing-zone
// Set 1 for all-over-snowing, set 2 for left-side-snowing
// Set 3 for center-snowing, set 4 for right-side-snowing
var snowingzone=1

///////////////////////////////////////////////////////////////////////////
// CONFIGURATION ENDS HERE
///////////////////////////////////////////////////////////////////////////


// Do not edit below this line
var snow=new Array()
var marginbottom
var marginright
var timer
var i_snow=0
var x_mv=new Array();
var crds=new Array();
var lftrght=new Array();
var browserinfos=navigator.userAgent
var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
var ns6=document.getElementById&&!document.all
var opera=browserinfos.match(/Opera/)
var browserok=ie5||ns6||opera

function randommaker(range) {
        rand=Math.floor(range*Math.random())
    return rand
}

function initsnow() {
        if (ie5 || opera) {
                marginbottom = document.body.scrollHeight
                marginright = document.body.clientWidth-15
        }
        else if (ns6) {
                marginbottom = document.body.scrollHeight
                marginright = window.innerWidth-15
        }
        var snowsizerange=snowmaxsize-snowminsize
        for (i=0;i<=snowmax;i++) {
                crds[i] = 0;
            lftrght[i] = Math.random()*15;
            x_mv[i] = 0.03 + Math.random()/10;
                snow[i]=document.getElementById("s"+i)
                snow[i].style.fontFamily=snowtype[randommaker(snowtype.length)]
                snow[i].size=randommaker(snowsizerange)+snowminsize
                snow[i].style.fontSize=snow[i].size+'px';
                snow[i].style.color=snowcolor[randommaker(snowcolor.length)]
                snow[i].style.zIndex=1000
                snow[i].sink=sinkspeed*snow[i].size/5
                if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
                if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
                if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
                if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
                snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size)
                snow[i].style.left=snow[i].posx+'px';
                snow[i].style.top=snow[i].posy+'px';
        }
        movesnow()
}

function movesnow() {
        for (i=0;i<=snowmax;i++) {
                crds[i] += x_mv[i];
                snow[i].posy+=snow[i].sink
                snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i])+'px';
                snow[i].style.top=snow[i].posy+'px';

                if (snow[i].posy>=marginbottom-2*snow[i].size || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])){
                        if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
                        if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
                        if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
                        if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
                        snow[i].posy=0
                }
        }
        var timer=setTimeout("movesnow()",50)
}

for (i=0;i<=snowmax;i++) {
        document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"'>"+snowletter+"</span>")
}
if (browserok) {
        window.onload=initsnow
}

</SCRIPT>

Save and reload
In another browser tab or windows, review the results.
If all is well as it should be, you're done.

Please mark as installed

UPDATE 12-23-2011

Not a code update, but an optimized suggestion. As I know many of you will start using this on Christmas Eve.

Suggestion:

If you know your community has a lot of mobile web users, such as Apple iPod, setting the snow fall value count to 20 works best. (original value is 35).

// Set the number of snowflakes (more than 30 - 40 not recommended)
var snowmax=20

Happy Holidays


If you're tired of vBulletin you should upgrade to Woltlab Burning Board http://woltlab.com

[3amalah]

http://www.llssll.com/vb/index.php?styleid=91

[Max Taxable]

CPU intensive on your visitors and users though. But will use it on Christmas Day anyway, THANKS!

[OldSchoolDSL]

Originally Posted by 3amalah

http://www.llssll.com/vb/index.php?styleid=91

I'm glad you like it, please click installed

[OldSchoolDSL]

Originally Posted by Max Taxable

CPU intensive on your visitors and users though. But will use it on Christmas Day anyway, THANKS!

No more so than any other java script.

The only higher than average load I got on this was if you're using a much older browser... ie .... Internet Explorer 6 (which is discontinued by Microsoft and vBulletin is also stopping support for).

Enjoy using this on Christmas

[Max Taxable]

Originally Posted by OldSchoolDSL

No more so than any other java script.

The only higher than average load I got on this was if you're using a much older browser... ie .... Internet Explorer 6 (which is discontinued by Microsoft and vBulletin is also stopping support for).

Enjoy using this on Christmas

On my FF 9 it increases CPU load quite a bit, and a couple of my staff coders noticed it too. It appears to be worse on IE9 though then it does on safari or FF.

I personally don't know of any humans still using IE6 Hahaha!

But like I said, it's not a permanent thing. Just a Christmas Day surprise and I appreciate it.

[Excilium]

I'm afraid all the ones I've installed have increased CPU usage, I don't think I'll be using this one either, thanks for the share at least!

[OldSchoolDSL]

Originally Posted by Excilium

I'm afraid all the ones I've installed have increased CPU usage, I don't think I'll be using this one either, thanks for the share at least!

Set the snow foll down to 20 and it loads fine on even an iPod

[j-bo]

Excellent. Just tested it and will be putting it into use on Christmas Eve.

[TheInformer]

Just installed this on our4.1.9 site and is working a treat, not noticed any major resource difference either