Adding a snow fall?

[nick_n_ii]

I found a Javascript for a snow fall on my site.

Problem is what file and where do I add it?

Thanks

[nick_n_ii]

Here is the script..

<script>
// CREDITS: // Snowmaker Copyright (c) 2003 Peter Gehrig. All rights reserved.
// Distributed by http://www.hypergurl.com // Permission given to use the script
on webpages provided that this notice remains as is. // 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")
// Set the fonts, that create the snowflakes. Add as many fonts as you like var
snowtype=new Array("Arial Black","Arial Narrow","Times","Comic
Sans MS") // 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 maximal-size of your snowflaxes var
snowmaxsize=22 // Set the minimal-size of your snowflaxes 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=3 ///////////////////////////////////////////////////////////////////////////
// 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.clientHeight
marginright = document.body.clientWidth } else if (ns6) { marginbottom = window.innerHeight
marginright = window.innerWidth } var snowsizerange=snowmaxsize-snowminsize for
(i=0;i<=snowmax;i++) { crds = 0; lftrght = Math.random()*15; x_mv
= 0.03 + Math.random()/10; snow=document.getElementById("s"+i) snow.style.fontFamily=snowtype[randommaker(snowtype.length)]
snow.size=randommaker(snowsizerange)+snowminsize snow.style.fontSize=snow.size
snow.style.color=snowcolor[randommaker(snowcolor.length)] snow.sink=sinkspeed*snow.size/5
if (snowingzone==1) {snow.posx=randommaker(marginright-snow.size)} if (snowingzone==2)
{snow.posx=randommaker(marginright/2-snow.size)} if (snowingzone==3) {snow.posx=randommaker(marginright/2-snow.size)+marginright/4}
if (snowingzone==4) {snow.posx=randommaker(marginright/2-snow.size)+marginright/2}
snow.posy=randommaker(2*marginbottom-marginbottom-2*snow.size) snow.style.left=snow.posx
snow.style.top=snow.posy } movesnow() } function movesnow() { for (i=0;i<=snowmax;i++)
{ crds += x_mv; snow.posy+=snow.sink snow.style.left=snow.posx+lftrght*Math.sin(crds);
snow.style.top=snow.posy if (snow.posy>=marginbottom-2*snow.size
|| parseInt(snow.style.left)>(marginright-3*lftrght)){ if (snowingzone==1)
{snow.posx=randommaker(marginright-snow.size)} if (snowingzone==2) {snow.posx=randommaker(marginright/2-snow.size)}
if (snowingzone==3) {snow.posx=randommaker(marginright/2-snow.size)+marginright/4}
if (snowingzone==4) {snow.posx=randommaker(marginright/2-snow.size)+marginright/2}
snow.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>

And here is the instructions:

SNOWMAKER JAVASCRIPT by Peter Gehrig

Make snow fall on your webpage this Christmas!

Here is a great falling snow javascript that doesn't need images uploaded to your server. It uses font types to make the snowflake images which makes it easier for users to install to their websites.

It is a one step script which you place into your webpage straight after the <body> tag.

Configure the variables at the top of the script to set the number of snowflakes, the colors, fonts and speed. Nothing else needs configuring.

STEP 1:

Copy and paste the falling snow javascript below after the <body> tag of your html.

I can't seem to figure out what my "HTML" file is..

[Arantor]

It would be in the index.template.php file of your theme.

If you can attach that file, someone can look at adding it for you.

[nick_n_ii]

Here is the file from my test site.

I so want to make sure it works correct before I put it in my main site..

Thanks I'm sure once it's in this file, I can figure out where to put it in the main sites file..

[Matthew K.]

I'll try adding it for you

I'm going to add it to a local SMF of mine and then give you the modification(s) I made to get it working properly.

Labradoodle-360

[nick_n_ii]

Very cool thanks...

[Matthew K.]

I added the JavaScript, did a couple edits to escape some errors got it up and running, but no snow falls is the problem...so something isn't correct with the actual JavaScript.

So, I'll give you the updated JavaScript with the proper place to put it (according to the script itself.) and then you can mess around with the Jscript or find another that works.

Find:

Code Select Expand

<body>';
Replace with:

Code Select Expand

<body>

<script type="text/javascript" langauge="JavaScript"><!-- // --><![CDATA[<
// CREDITS: // Snowmaker Copyright (c) 2003 Peter Gehrig. All rights reserved.
// Distributed by http://www.hypergurl.com // Permission given to use the script
on webpages provided that this notice remains as is. // 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")
// Set the fonts, that create the snowflakes. Add as many fonts as you like var
snowtype=new Array("Arial Black","Arial Narrow","Times","Comic
Sans MS") // 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 maximal-size of your snowflaxes var
snowmaxsize=22 // Set the minimal-size of your snowflaxes 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=3 ///////////////////////////////////////////////////////////////////////////
// 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.clientHeight
marginright = document.body.clientWidth } else if (ns6) { marginbottom = window.innerHeight
marginright = window.innerWidth } var snowsizerange=snowmaxsize-snowminsize for
(i=0;i<=snowmax;i++) { crds = 0; lftrght = Math.random()*15; x_mv
= 0.03 + Math.random()/10; snow=document.getElementById("s"+i) snow.style.fontFamily=snowtype[randommaker(snowtype.length)]
snow.size=randommaker(snowsizerange)+snowminsize snow.style.fontSize=snow.size
snow.style.color=snowcolor[randommaker(snowcolor.length)] snow.sink=sinkspeed*snow.size/5
if (snowingzone==1) {snow.posx=randommaker(marginright-snow.size)} if (snowingzone==2)
{snow.posx=randommaker(marginright/2-snow.size)} if (snowingzone==3) {snow.posx=randommaker(marginright/2-snow.size)+marginright/4}
if (snowingzone==4) {snow.posx=randommaker(marginright/2-snow.size)+marginright/2}
snow.posy=randommaker(2*marginbottom-marginbottom-2*snow.size) snow.style.left=snow.posx
snow.style.top=snow.posy } movesnow() } function movesnow() { for (i=0;i<=snowmax;i++)
{ crds += x_mv; snow.posy+=snow.sink snow.style.left=snow.posx+lftrght*Math.sin(crds);
snow.style.top=snow.posy if (snow.posy>=marginbottom-2*snow.size
|| parseInt(snow.style.left)>(marginright-3*lftrght)){ if (snowingzone==1)
{snow.posx=randommaker(marginright-snow.size)} if (snowingzone==2) {snow.posx=randommaker(marginright/2-snow.size)}
if (snowingzone==3) {snow.posx=randommaker(marginright/2-snow.size)+marginright/4}
if (snowingzone==4) {snow.posx=randommaker(marginright/2-snow.size)+marginright/2}
snow.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>
';


Labradoodle-360

[Arantor]

Not sure you need to \ in front of the " as well as the ' characters...

[Matthew K.]

Yep, you don't. Forgot to remove those, sorry.

[Matthew K.]

Updated:

Code Select Expand


<body>

      <script type="text/javascript" langauge="JavaScript"><!-- // --><![CDATA[<
// CREDITS: // Snowmaker Copyright (c) 2003 Peter Gehrig. All rights reserved.
// Distributed by http://www.hypergurl.com // Permission given to use the script
on webpages provided that this notice remains as is. // 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")
// Set the fonts, that create the snowflakes. Add as many fonts as you like var
snowtype=new Array("Arial Black","Arial Narrow","Times","Comic
Sans MS") // 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 maximal-size of your snowflaxes var
snowmaxsize=22 // Set the minimal-size of your snowflaxes 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=3 ///////////////////////////////////////////////////////////////////////////
// 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.clientHeight
marginright = document.body.clientWidth } else if (ns6) { marginbottom = window.innerHeight
marginright = window.innerWidth } var snowsizerange=snowmaxsize-snowminsize for
(i=0;i<=snowmax;i++) { crds = 0; lftrght = Math.random()*15; x_mv
= 0.03 + Math.random()/10; snow=document.getElementById("s"+i) snow.style.fontFamily=snowtype[randommaker(snowtype.length)]
snow.size=randommaker(snowsizerange)+snowminsize snow.style.fontSize=snow.size
snow.style.color=snowcolor[randommaker(snowcolor.length)] snow.sink=sinkspeed*snow.size/5
if (snowingzone==1) {snow.posx=randommaker(marginright-snow.size)} if (snowingzone==2)
{snow.posx=randommaker(marginright/2-snow.size)} if (snowingzone==3) {snow.posx=randommaker(marginright/2-snow.size)+marginright/4}
if (snowingzone==4) {snow.posx=randommaker(marginright/2-snow.size)+marginright/2}
snow.posy=randommaker(2*marginbottom-marginbottom-2*snow.size) snow.style.left=snow.posx
snow.style.top=snow.posy } movesnow() } function movesnow() { for (i=0;i<=snowmax;i++)
{ crds += x_mv; snow.posy+=snow.sink snow.style.left=snow.posx+lftrght*Math.sin(crds);
snow.style.top=snow.posy if (snow.posy>=marginbottom-2*snow.size
|| parseInt(snow.style.left)>(marginright-3*lftrght)){ if (snowingzone==1)
{snow.posx=randommaker(marginright-snow.size)} if (snowingzone==2) {snow.posx=randommaker(marginright/2-snow.size)}
if (snowingzone==3) {snow.posx=randommaker(marginright/2-snow.size)+marginright/4}
if (snowingzone==4) {snow.posx=randommaker(marginright/2-snow.size)+marginright/2}
snow.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>
';

[nick_n_ii]

Ok might want to try this.  This is suppose to be ALL the files need to set up snow flakes falling..

I'm playing with his one also..

Figure sooner or later one of us will get it working right..

[Arantor]

Tell you what. That first part doesn't look right to me at all.

Code Select Expand

// CREDITS:
// Snowmaker Copyright (c) 2003 Peter Gehrig. All rights reserved.
// Distributed by http://www.hypergurl.com
// Permission given to use the script
on webpages provided that this notice remains as is.
// 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")
// Set the fonts, that create the snowflakes. Add as many fonts as you like
var snowtype=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS")
// 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 maximal-size of your snowflaxes
var snowmaxsize=22
// Set the minimal-size of your snowflaxes
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=3

[nick_n_ii]

Here's another snow script.  I think I might be placing them in the wrong file..

<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="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 = 0;                        // set coordinate variables
    xp = Math.random()*(doc_width-50);  // set position variables
    yp = Math.random()*doc_height;
    am = Math.random()*20;         // set amplitude variables
    stx = 0.02 + Math.random()/10; // set step variables
    sty = 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 += sty;
      if (yp > doc_height-50) {
        xp = Math.random()*(doc_width-am-30);
        yp = 0;
        stx = 0.02 + Math.random()/10;
        sty = 0.7 + Math.random();
      }
      dx += stx;
      document.getElementById("dot"+i).style.top=yp+"px";
      document.getElementById("dot"+i).style.left=xp + am*Math.sin(dx)+"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>

[genusis]

you want ti working like this right...

http://spirean.com/index.php

well in your default themes index add the snowstorm.js to the scripts folder.

then in your themes  index.template.php

find <head> under it add

echo'<script type="text/javascript" src="', $settings['default_theme_url'], '/scripts/snowstorm.js"></script>';

whala working snow.

[Matthew K.]

It may help if you attach snowstorm.js too

[genusis]

its in the file  snowstormv14_20091115.zip  which is already attached above.

[Matthew K.]

Ah, okay sorry.

[genusis]

no problem , well i hope this solves this problem.... i usually lurk the forums and not help much or post much at that matter XD.

[Matthew K.]

After I get a couple current projects out of the way, I am going to code this into a mod and submit it to the Mod Site.

Labradoodle-360

[Marcus Forsberg]

Keep in mind though that you need permission from the author of the script to redistribute it.