Announcement

Collapse
No announcement yet.

Falling snow on background

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • Falling snow on background

    I have noticed on some boards that they have animated snow falling over the background.Where do i need to add the code for the snow image (see attachment).

    Thanks.
    Techzonez - Tech News
    Techzonez Forums - Tech Community

  • #2
    Think it's probably one of those javascripts which would go in the header.

    Comment


    • #3
      Originally posted by nemesis01
      Think it's probably one of those javascripts which would go in the header.
      No. All you need to do is add this to your body tag:

      background="snow.gif"
      :)

      Comment


      • #4
        Originally posted by DirectPixel
        No. All you need to do is add this to your body tag:

        background="snow.gif"

        I tried this but becuase I am already using an Image for the background it is not working.

        Is there any way to keep my background and add this additional back ground?

        Comment


        • #5
          Originally posted by madhouse
          I tried this but becuase I am already using an Image for the background it is not working.

          Is there any way to keep my background and add this additional back ground?
          Yes. Make a table that stretches 100% wide and 100% high, and use CSS to set that table's opacity to about 50%, and set the image as its background.
          :)

          Comment


          • #6
            Originally posted by DirectPixel
            Yes. Make a table that stretches 100% wide and 100% high, and use CSS to set that table's opacity to about 50%, and set the image as its background.
            It's nice on a background.
            But mayB 2 heavy for our 56k users

            Comment


            • #7
              [QUOTE] Originally posted by Flup
              It's nice on a background.
              But mayB 2 heavy for our 56k users
              [/QUOTE

              I hate to be a dummy but could you be more detailed? Are you saying that one can have two backgrounds working on one page? THAT is something I have been trying to figure out for some time now!

              Comment


              • #8
                [QUOTE] Originally posted by RavenBeauty
                Originally posted by Flup
                It's nice on a background.
                But mayB 2 heavy for our 56k users
                [/QUOTE

                I hate to be a dummy but could you be more detailed? Are you saying that one can have two backgrounds working on one page? THAT is something I have been trying to figure out for some time now!
                Could be working.
                1 colored background and 1 image background in .GIF format. But I don't think all browsers reconize this.

                Comment


                • #9
                  Originally posted by Flup
                  Could be working.
                  1 colored background and 1 image background in .GIF format. But I don't think all browsers reconize this.


                  I got it to work with a color back ground then the snow image

                  example: <body background="/forum/images/snow.gif" bgcolor="#636262" text="#ffffff" ETC...

                  This would be for the Body Tag.

                  ---------------------------------
                  #636262" background="/forum/images/snow.gif

                  This would be for the page background color.

                  Comment


                  • #10
                    It's 5k, I really don't think modem users will be bothered much by it. And as for setting it as background: if you already use a background image, the only option is to put your entire layout into a 100% streched table. Set the background of the table to the snow image, and you'll have a snow background that overlaps your own background (thanks to good old gif transparency).
                    You could also try to create an animated gif that has your own background with the snow added to it. It's a question of preference I suppose.
                    - Insert viable disclaimer here -

                    ArtBeast!

                    Comment


                    • #11
                      Snow Flakes here:
                      http://www.dynamicdrive.com/dynamicindex3/snow.htm
                      Rain here:
                      http://www.dynamicdrive.com/dynamicindex3/rain.htm
                      Bubbles here:
                      http://www.dynamicdrive.com/dynamicindex3/bubble.htm


                      MORE SNOW FLAKES
                      This one doesn't use images!!
                      <head>
                      <script language="javascript">
                      //Rain/Snow effect- By Craig Blanchette Craiga.topcities.com
                      //Script featured on Dynamic Drive
                      //Visit http://www.dynamicdrive.com for this script and more
                      snow = true; // false-rain; true-snow
                      snowsym = " * " //These are the symbols for each
                      rainsym = " ' " //You can put images here.
                      howmany = 10 //How many drops/snowflakes?
                      /**************Do not need to change anything below***********/
                      if(snow){sym = snowsym; speed=1; angle=10; drops=howmany}
                      else{sym = rainsym; speed=50; drops=howmany; angle=6}
                      movex = -speed/angle; movey = speed; count = 0;
                      function moverain(){
                      for(move = 0; move < drops; move++){
                      xx[move]+=movex; yy[move]+=mv[move];
                      hmm = Math.round(Math.random()*1);
                      if(xx[move] < 0){xx[move] = maxx+10;}
                      if(yy[move] > maxy){yy[move] = 10;}
                      drop[move].left = xx[move]
                      drop[move].top = yy[move]+document.body.scrollTop;
                      }setTimeout('moverain()','1')}
                      </script>
                      </head>
                      <body bgcolor="#000000" text="#FFFFFF">
                      <script language="javascript">
                      if (document.all){
                      drop = new Array(); xx = new Array(); yy = new Array(); mv = new Array()
                      ly = "document.all[\'"; st = "\'].style"
                      for(make = 0; make < drops; make++){
                      document.write('<div id="drop'+make+'" class=drop>'+sym+'</div>');
                      drop[make] = eval(ly+'drop'+make+st);
                      maxx = document.body.clientWidth-40
                      maxy = document.body.clientHeight-40
                      xx[make] = Math.random()*maxx;
                      yy[make] = -100-Math.random()*maxy;
                      drop[make].left = xx[make]
                      drop[make].top = yy[make]
                      mv[make] = (Math.random()*5)+speed/4;
                      drop[make].fontSize = (Math.random()*10)+20;
                      if(snow){col = 'white'}else{col = 'blue'}
                      drop[make].color = col;
                      }
                      window.onload=moverain
                      }
                      </script>
                      </body>

                      How this helps u guys out can someone help me out with a tight style :-)

                      Comment


                      • #12
                        I like the one that doesn't use images it doesn't make the page scroll.

                        Comment

                        Related Topics

                        Collapse

                        Working...
                        X