The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Snow flakes on website

View previous topic View next topic Go down

Snow flakes on website

Post by DJSR on December 25th 2010, 2:22 pm

Hi all and Merry Xmas Smile


I am trying to add snow flakes to my forum, and i found an old post but none of the scripts work.

Can someone please show me a script which works and where to enter it in the Admin Panel.

Thanks in advance.

DJ Smile

DJSR
Forumember

Posts : 29
Reputation : 0
Language : English

Back to top Go down

Re: Snow flakes on website

Post by boffer10 on December 25th 2010, 4:07 pm

Put this in your Homepage Message. Snow will show just on the index page. At the top of the code there are four variables to play with, where it says 'configure'


Code:
<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="http://i62.servimg.com/u/f62/14/92/49/47/snow310.gif"
  // Configure below to change number of snow to render
  var no = 15;
  // Configure whether snow should disappear after x seconds (0=never):
  var hidesnowtime = 15;
  // 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>



Or, put this code in your CSS to have snow on all pages
Code:

 body {
    background-color: #000000;
    background-image: url("http://img200.imageshack.us/img200/8838/snowe.gif");
    opacity:0.8;
    filter:alpha(opacity=90);
  }

boffer10
Forumember

Male Posts : 311
Reputation : 10
Language : english
Location : Go Seahawks!

http://squarefoot.creatingforum.com/

Back to top Go down

Re: Snow flakes on website

Post by DJSR on December 25th 2010, 4:16 pm

Hi boffer10, thanks for the reply.

I've put the 1st script in admin panel > display > generalities > homepage message .....and it still isnt showing. i left the config as you put it, just to see if it works.

I'm not sure where the CSS is to put the other code??

Cheers.

DJSR
Forumember

Posts : 29
Reputation : 0
Language : English

Back to top Go down

Re: Snow flakes on website

Post by boffer10 on December 25th 2010, 4:25 pm

I copied/pasted from the homepage message there. I don't know what to say about it not working on your forum.


CSS location. Just stick the code at the end and hit save.


Last edited by boffer10 on December 25th 2010, 9:30 pm; edited 1 time in total

boffer10
Forumember

Male Posts : 311
Reputation : 10
Language : english
Location : Go Seahawks!

http://squarefoot.creatingforum.com/

Back to top Go down

Re: Snow flakes on website

Post by DJSR on December 25th 2010, 6:26 pm

Thanks boffer, the CSS effect worked ok, i wish the other effect would to. thanks mate.

DJSR
Forumember

Posts : 29
Reputation : 0
Language : English

Back to top Go down

Re: Snow flakes on website

Post by boffer10 on December 25th 2010, 6:40 pm

I don't know why it doesn't work for you. I even had both effects going at the same time. Here's the code again, maybe it got messed up in the copy/pasting?

Code:
<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="http://i62.servimg.com/u/f62/14/92/49/47/snow310.gif"
  // Configure below to change number of snow to render
  var no = 15;
  // Configure whether snow should disappear after x seconds (0=never):
  var hidesnowtime = 15;
  // 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>





Here's my page, but there's not much to see. I have other stuff there as well.



Merry Christmas

boffer10
Forumember

Male Posts : 311
Reputation : 10
Language : english
Location : Go Seahawks!

http://squarefoot.creatingforum.com/

Back to top Go down

Re: Snow flakes on website

Post by DJSR on December 25th 2010, 6:50 pm

Nope it still doesnt show, never mind.

The CSS script is causing a bit of lag on the site, i dont know if this is normal or not. The announcement scroll is jerky.

thanks for your efforts mate & Merry Christmas Smile

DJSR
Forumember

Posts : 29
Reputation : 0
Language : English

Back to top Go down

Re: Snow flakes on website

Post by Guest on December 27th 2010, 12:37 am

That javascript didn't work for me either. The CSS causes lag because it is a GIF image in the background repeated to make it appear like its snowing. It also makes the backgrounds transparent which adds more loading (lag).

Guest
Guest


Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum