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

</vb:if>
</div>

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

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

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

[Gemma]

Thanks for sharing, I've limited it to forumhome so it doesn't annoy my arcade players or members reading forum posts.

[etca]

Thanks, installed on my 4.1.8

[OldSchoolDSL]

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

PHP Code:

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


Happy Holidays

[steve1966]

Thank you

[karlm]

Thanks for this.

[OldSchoolDSL]

Tested to be working on

4.1.10

Will re-visit and reevaluate compatibility of code on current vBulletin release November 2012.

Please keep "marked install" for updates around that time (if any).

[OldSchoolDSL]

Originally Posted by OldSchoolDSL

Tested to be working on

4.1.10

Will re-visit and reevaluate compatibility of code on current vBulletin release November 2012.

Please keep "marked install" for updates around that time (if any).

As promised... Revisited

Code is still working on everything I've tested this on. :up:

Tested and working on vBulletin 3, 4, and even 5 Beta

[RedTurtle]

This doesn't work for me on the latest version of Chrome, running vB 4.2.0 PL3.

Works on Firefox and Internet Explorer though.

[OldSchoolDSL]

Originally Posted by RedTurtle

This doesn't work for me on the latest version of Chrome, running vB 4.2.0 PL3.

Works on Firefox and Internet Explorer though.

Can not confirm your issue. Works on current, beta, and alpha (dev) version of Google Chrome on the stock install using the default skin (theme).

If this is not working for you; chances are you have something else conflicting with it. Either installed on your site or within your browser.

[faisaly.com]

this does work using vb4.2.0 pl3 and using firefox browser! have not tested using chrome or ie