Add A Snow Flake Effect To Your Board
Posted: 04 Mar 2010, 22:03
Add A Snow Flake Effect To Your Board
Written by Jaymie1989
This script adds a snow flake effect to your forum, Either to your Index page of to have it on every page of your forum the Overall_Header.html.
Features:
Credits to DynamicDrive for this script
Instructions:
Use Across Your Forum:
Open - Styles > YOUR STYLE > templates > Overall_Header.html
For index page open this file:
Open - Styles > YOUR STYLE > templates > Index_Body.html
Find:
Add Before:
Save. Then in your ACP go to Styles > Templates > on your style REFRESH it and it should work.
At the top of that script you will see You can change the 10 to how many flakes you want to show on your screen each time.
Place your snow flake in the images directory of your forum and here are 2 snow flakes you can use just make sure the image is called snow.gif and it will work. You can use your own flake but name the image as snow.gif for it to work.
To turn the flakes off when you dont want them but without removing the whole code just change the number '10' in the code to '0' like in the code below.
Here are 2 snow flake images
Written by Jaymie1989
This script adds a snow flake effect to your forum, Either to your Index page of to have it on every page of your forum the Overall_Header.html.
Features:
- Able to change how many flakes show on the page at the same time.
- Change how fast they come down.
- Change the image of the flake that you want to use.
Credits to DynamicDrive for this script
Instructions:
Use Across Your Forum:
Open - Styles > YOUR STYLE > templates > Overall_Header.html
For index page open this file:
Open - Styles > YOUR STYLE > templates > Index_Body.html
Find:
Code: Select all
</head>Code: Select all
<script type="text/javascript">
/******************************************
* Snow Effect Script- By Altan d.o.o. (http://www.altan.hr/snow/index.html)
* Visit Dynamic Drive DHTML code library (http://www.dynamicdrive.com/) for full source code
* Last updated Nov 9th, 05' by DD. This notice must stay intact for use
******************************************/
//Configure below to change URL path to the snow image
var snowsrc="./images/snow.gif"
// Configure below to change number of snow to render
var no = 10;
// Configure whether snow should disappear after x seconds (0=never):
var hidesnowtime = 0;
// Configure how much snow should drop down before fading ("windowheight" or "pageheight")
var snowdistance = "pageheight";
///////////Stop Config//////////////////////////////////
var ie4up = (document.all) ? 1 : 0;
var ns6up = (document.getElementById&&!document.all) ? 1 : 0;
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
var dx, xp, yp; // coordinate and position variables
var am, stx, sty; // amplitude and step variables
var i, doc_width = 800, doc_height = 600;
if (ns6up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
} else if (ie4up) {
doc_width = iecompattest().clientWidth;
doc_height = iecompattest().clientHeight;
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "snow.gif" : snowsrc
for (i = 0; i < no; ++ i) {
dx[i] = 0; // set coordinate variables
xp[i] = Math.random()*(doc_width-50); // set position variables
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20; // set amplitude variables
stx[i] = 0.02 + Math.random()/10; // set step variables
sty[i] = 0.7 + Math.random(); // set step variables
if (ie4up||ns6up) {
if (i == 0) {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");
} else {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>");
}
}
}
function snowIE_NS6() { // IE and NS6 main animation function
doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
for (i = 0; i < no; ++ i) { // iterate for every dot
yp[i] += sty[i];
if (yp[i] > doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
}
dx[i] += stx[i];
document.getElementById("dot"+i).style.top=yp[i]+"px";
document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";
}
snowtimer=setTimeout("snowIE_NS6()", 10);
}
function hidesnow(){
if (window.snowtimer) clearTimeout(snowtimer)
for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
}
if (ie4up||ns6up){
snowIE_NS6();
if (hidesnowtime>0)
setTimeout("hidesnow()", hidesnowtime*1000)
}
</script>At the top of that script you will see
Code: Select all
// Configure below to change number of snow to render
var no = 10;Place your snow flake in the images directory of your forum and here are 2 snow flakes you can use just make sure the image is called snow.gif and it will work. You can use your own flake but name the image as snow.gif for it to work.
To turn the flakes off when you dont want them but without removing the whole code just change the number '10' in the code to '0' like in the code below.
Code: Select all
// Configure below to change number of snow to render
var no = 0;- snow.gif (256 Bytes) Viewed 5221 times
- snow1.gif (425 Bytes) Viewed 5221 times
