PDA

View Full Version : Using a png image instead of what it's using now, help.



ambercakes
08-02-2009, 07:30 PM
Hello there! I am using this script just fine and it works for what I'm using it for. But, I just want to be able to use images for next time. That would be nice. I don't know how to incorporate images instead of the flakes.
This one had a .js file you had to upload to a site but I incorporated it into the script itself in the html. It works for what I'm using it for (for Incredimail).
Please help so that I can use images in this script such as a small snowflake for instance. Here is the script:


<SCRIPT type=text/javascript>

/***********************************************

* Snow Effect without images-by Kurt Grigg at http://www.btinternet.com/~kurt.grigg/javascript

* Script featured & available at Dynamic Drive at http://www.dynamicdrive.com/

* Please keep this notice intact

***********************************************/

//Snow - http://www.btinternet.com/~kurt.grigg/javascript

if ((document.getElementById) &&
window.addEventListener || window.attachEvent){

(function(){

//Configure here.

var num = 30; //Number of flakes
var timer = 30; //setTimeout speed. Varies on different comps
var enableinNS6 = 1 //Enable script in NS6/Mozilla? Snow animation could be slow in those browsers. (1=yes, 0=no).

//End.

var y = [];
var x = [];
var fall = [];
var theFlakes = [];
var sfs = [];
var step = [];
var currStep = [];
var h,w,r;
var d = document;
var pix = "px";
var domWw = (typeof window.innerWidth == "number");
var domSy = (typeof window.pageYOffset == "number");
var idx = d.getElementsByTagName('div').length;

if (d.documentElement.style &&
typeof d.documentElement.style.MozOpacity == "string")
num = 12;

for (i = 0; i < num; i++){
sfs[i] = Math.round(1 + Math.random() * 1); <!-- This is the size of the flakes, too big looks ugly-->


document.write('<div id="flake'+(idx+i)+'" style="position:absolute;top:0px;left:0px;width:'
+sfs[i]+'px;height:'+sfs[i]+'px;background-color:#ffffff;font-size:'+sfs[i]+'px"><\/div>'); <!-- This is the color of the flakes-->


currStep[i] = 0;
fall[i] = (sfs[i] == 1)?
Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
step[i] = (sfs[i] == 1)?
0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
}


if (domWw) r = window;
else{
if (d.documentElement &&
typeof d.documentElement.clientWidth == "number" &&
d.documentElement.clientWidth != 0)
r = d.documentElement;
else{
if (d.body &&
typeof d.body.clientWidth == "number")
r = d.body;
}
}


function winsize(){
var oh,sy,ow,sx,rh,rw;
if (domWw){
if (d.documentElement && d.defaultView &&
typeof d.defaultView.scrollMaxY == "number"){
oh = d.documentElement.offsetHeight;
sy = d.defaultView.scrollMaxY;
ow = d.documentElement.offsetWidth;
sx = d.defaultView.scrollMaxX;
rh = oh-sy;
rw = ow-sx;
}
else{
rh = r.innerHeight;
rw = r.innerWidth;
}
h = rh - 2;
w = rw - 2;
}
else{
h = r.clientHeight - 2;
w = r.clientWidth - 2;
}
}


function scrl(yx){
var y,x;
if (domSy){
y = r.pageYOffset;
x = r.pageXOffset;
}
else{
y = r.scrollTop;
x = r.scrollLeft;
}
return (yx == 0)?y:x;
}


function snow(){
var dy,dx;

for (i = 0; i < num; i++){
dy = fall[i];
dx = fall[i] * Math.cos(currStep[i]);

y[i]+=dy;
x[i]+=dx;

if (x[i] >= w || y[i] >= h){
y[i] = -10;
x[i] = Math.round(Math.random() * w);
fall[i] = (sfs[i] == 1)?
Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
step[i] = (sfs[i] == 1)?
0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
}

theFlakes[i].top = y[i] + scrl(0) + pix;
theFlakes[i].left = x[i] + scrl(1) + pix;

currStep[i]+=step[i];
}
setTimeout(snow,timer);
}


function init(){
winsize();
for (i = 0; i < num; i++){
theFlakes[i] = document.getElementById("flake"+(idx+i)).style;
y[i] = Math.round(Math.random()*h);
x[i] = Math.round(Math.random()*w);
}
snow();
}


if (window.addEventListener){
window.addEventListener("resize",winsize,false);
window.addEventListener("load",init,false);
}
else if (window.attachEvent){
window.attachEvent("onresize",winsize);
window.attachEvent("onload",init);
}

})();
}//End.

</SCRIPT>

vwphillips
08-03-2009, 09:12 AM
..........



for (i = 0; i < num; i++){
sfs[i] = Math.round(1 + Math.random() * 1); <!-- This is the size of the flakes, too big looks ugly-->


document.write('<div id="flake'+(idx+i)+'" style="position:absolute;overflow:hidden;top:0px;left:0px;width:'
+sfs[i]+'px;height:'+sfs[i]+'px;"><img src="MyImage.png" style="width:100%;height:100%;" ><\/div>'); <!-- This is the color of the flakes-->


currStep[i] = 0;
fall[i] = (sfs[i] == 1)?
Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
step[i] = (sfs[i] == 1)?
0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
}


..............

ambercakes
08-04-2009, 02:50 AM
Sorry vwphillips. Maybe this part will help in you fixing it. That code did not do anything to the script, sorry I forgot to put the below in. Thanks for your help.
Here is the code that should have been attached at the bottom of the script. But the code goes all the way to id flake #37. It would not let me put all of it. Thanks.



<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake0></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake1></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake2></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake3></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake4></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake5></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake6></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake7></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake8></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake9></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake10></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake11></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake12></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake13></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake14></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake15></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake16></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake17></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake18></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake19></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake20></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake21></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake22></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake23></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake24></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake25></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake26></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake27></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 0px; LEFT: 0px" id=flake28></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 0px; LEFT: 0px" id=flake29></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 245px; LEFT: 159px" id=flake0></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 46px; LEFT: 358px" id=flake1></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 434px; LEFT: 317px" id=flake2></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 426px; LEFT: 732px" id=flake3></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 122px; LEFT: 192px" id=flake4></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 114px; LEFT: -41px" id=flake5></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 227px; LEFT: 811px" id=flake6></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 30px; LEFT: 656px" id=flake7></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 402px; LEFT: 183px" id=flake8></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 278px; LEFT: 1006px" id=flake9></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 476px; LEFT: 1151px" id=flake10></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: -1px; LEFT: 675px" id=flake11></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 414px; LEFT: 633px" id=flake12></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 374px; LEFT: 623px" id=flake13></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 22px; LEFT: 903px" id=flake14></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 246px; LEFT: 34px" id=flake15></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 225px; LEFT: 988px" id=flake16></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 108px; LEFT: 354px" id=flake17></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 290px; LEFT: 794px" id=flake18></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 353px; LEFT: 338px" id=flake19></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 300px; LEFT: 557px" id=flake20></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 62px; LEFT: 59px" id=flake21></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 105px; LEFT: 1012px" id=flake22></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 326px; LEFT: 392px" id=flake23></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 398px; LEFT: 580px" id=flake24></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 270px; LEFT: 1108px" id=flake25></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 314px; LEFT: 1026px" id=flake26></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 182px; LEFT: 943px" id=flake27></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 194px; LEFT: 1229px" id=flake28></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 260px; LEFT: -3px" id=flake29></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 155px; LEFT: 765px" id=flake8></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 71px; LEFT: 651px" id=flake9></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 161px; LEFT: 529px" id=flake10></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 214px; LEFT: 563px" id=flake11></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 23px; LEFT: 801px" id=flake12></DIV>
<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 1px; HEIGHT: 1px; FONT-SIZE: 1px; TOP: 488px; LEFT: 886px" id=flake13></DIV>

<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ffffff; WIDTH: 2px; HEIGHT: 2px; FONT-SIZE: 2px; TOP: 40px; LEFT: 407px" id=flake14></DIV>

vwphillips
08-04-2009, 02:28 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
</head>

<body>

<SCRIPT type=text/javascript>

/***********************************************

* Snow Effect without images-by Kurt Grigg at http://www.btinternet.com/~kurt.grigg/javascript

* Script featured & available at Dynamic Drive at http://www.dynamicdrive.com/

* Please keep this notice intact

***********************************************/

//Snow - http://www.btinternet.com/~kurt.grigg/javascript

if ((document.getElementById) &&
window.addEventListener || window.attachEvent){

(function(){

//Configure here.

var num = 30; //Number of flakes
var timer = 30; //setTimeout speed. Varies on different comps
var enableinNS6 = 1 //Enable script in NS6/Mozilla? Snow animation could be slow in those browsers. (1=yes, 0=no).
var Img='http://www.vicsjavascripts.org.uk/StdImages/One.gif';
var MaxSize=15;
var MinSize=5;
//End.

var y = [];
var x = [];
var fall = [];
var theFlakes = [];
var sfs = [];
var step = [];
var currStep = [];
var h,w,r;
var d = document;
var pix = "px";
var domWw = (typeof window.innerWidth == "number");
var domSy = (typeof window.pageYOffset == "number");
var idx = d.getElementsByTagName('div').length;

if (d.documentElement.style &&
typeof d.documentElement.style.MozOpacity == "string")
num = 12;

for (i = 0; i < num; i++){
sfs[i] = Math.round(MinSize + Math.random() * (MaxSize-MinSize)); <!-- This is the size of the flakes, too big looks ugly-->
document.write('<img id="flake'+(idx+i)+'" style="position:absolute;top:0px;left:0px;width:'
+sfs[i]+'px;height:'+sfs[i]+'px;" src="'+Img+'" />'); <!-- This is the color of the flakes-->


currStep[i] = 0;
fall[i] = (sfs[i] == 1)?Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
step[i] = (sfs[i] == 1)?0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
}


if (domWw) r = window;
else{
if (d.documentElement &&
typeof d.documentElement.clientWidth == "number" &&
d.documentElement.clientWidth != 0)
r = d.documentElement;
else{
if (d.body &&
typeof d.body.clientWidth == "number")
r = d.body;
}
}


function winsize(){
var oh,sy,ow,sx,rh,rw;
if (domWw){
if (d.documentElement && d.defaultView &&
typeof d.defaultView.scrollMaxY == "number"){
oh = d.documentElement.offsetHeight;
sy = d.defaultView.scrollMaxY;
ow = d.documentElement.offsetWidth;
sx = d.defaultView.scrollMaxX;
rh = oh-sy;
rw = ow-sx;
}
else{
rh = r.innerHeight;
rw = r.innerWidth;
}
h = rh - 2;
w = rw - 2;
}
else{
h = r.clientHeight - 2;
w = r.clientWidth - 2;
}
}


function scrl(yx){
var y,x;
if (domSy){
y = r.pageYOffset;
x = r.pageXOffset;
}
else{
y = r.scrollTop;
x = r.scrollLeft;
}
return (yx == 0)?y:x;
}


function snow(){
var dy,dx;
for (i = 0; i < num; i++){
dy = fall[i];
dx = fall[i] * Math.cos(currStep[i]);
y[i]+=dy;
x[i]+=dx;

if (x[i] >= w || y[i] >= h){
y[i] = -10;
x[i] = Math.round(Math.random() * w);
fall[i] = (sfs[i] == 1)?
Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);
step[i] = (sfs[i] == 1)?
0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;
}

theFlakes[i].style.top = y[i] + scrl(0) + pix;
theFlakes[i].style.left = x[i] + scrl(1) + pix;

currStep[i]+=step[i];
}
setTimeout(snow,timer);
}


function init(){
winsize();
for (i = 0; i < num; i++){
theFlakes[i] = document.getElementById("flake"+(idx+i));
y[i] = Math.round(Math.random()*h);
x[i] = Math.round(Math.random()*w);
}
snow();
}


if (window.addEventListener){
window.addEventListener("resize",winsize,false);
window.addEventListener("load",init,false);
}
else if (window.attachEvent){
window.attachEvent("onresize",winsize);
window.attachEvent("onload",init);
}

})();
}//End.

</SCRIPT>

</html>

ambercakes
08-05-2009, 03:56 AM
Thanks so much vwPhillips. This is what I wanted. So much appreciated.