SMF For Free Support Forum
SMF For Free Support => SMF For Free Codes and Support => Code Requests => Topic started by: LaundryLady on October 29, 2007, 01:38:16 pm
-
Forum Url: http://thelaundryroom.smfforfree2.com
I have a code that I used for my flying ghosts for Halloween, however, I need it to fall down in order to put snow, leaves, etc. on my site. This particular code works on both FF and IE. I have seen others that are very similar but they do not work on FF.
Can anyone make the images fall down without changing what browsers it works on?
<script type="text/javascript">
<!--
//Autumn leaves- by Kurt Grigg (kurt.grigg@virgin.net)
//Modified by Dynamic Drive for NS6 functionality
//visit http://www.dynamicdrive.com for this script
//Modified by jscheuer1 in http://www.dynamicdrive.com/forums
//to fall up, add doctype compatibility & account for
//differences in speeds among browsers
var speed=90 // 12 to whatever (60 is pretty slow) higher numbers are slower
Amount=8; //Smoothness depends on image file size, the smaller the size the more you can use!
//Pre-load your image below!
grphcs=new Array(6)
Image0=new Image();
Image0.src=grphcs[0]="IMAGE URL GOES HERE";
//////////////// Stop Editing //////////////
function iecompattest(){
return (document.compatMode && document.compatMode.indexOf("CSS")!=-1)? document.documentElement : document.body
}
Ypos=new Array();
Xpos=new Array();
Speed=new Array();
Step=new Array();
Cstep=new Array();
ns=(document.layers)?1:0;
ns6=(document.getElementById&&!document.all||window.opera)?1:0;
speed=ns6? speed-12 : speed
if (ns){
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");
}
}
else{
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
}
document.write('</div></div>');
}
WinHeight=(ns||ns6)?window.innerHeight:window.iecompattest().clientHeight;
WinWidth=(ns||ns6)?window.innerWidth-70:window.iecompattest().clientWidth;
for (i=0; i < Amount; i++){
Ypos[i] = Math.round(Math.random()*WinHeight);
Xpos[i] = Math.round(Math.random()*WinWidth);
Speed[i]= (Math.random()*5+3)*-1;
Cstep[i]=0;
Step[i]=Math.random()*0.1+0.05;
}
function fall(){
var WinHeight=(ns||ns6)?window.innerHeight:window.iecompattest().clientHeight;
var WinWidth=(ns||ns6)?window.innerWidth-70:window.iecompattest().clientWidth;
var hscrll=(ns||ns6)?window.pageYOffset:iecompattest().scrollTop;
var wscrll=(ns||ns6)?window.pageXOffset:iecompattest().scrollLeft;
for (i=0; i < Amount; i++){
sy = Speed[i]*Math.sin(90*Math.PI/180);
sx = Speed[i]*Math.cos(Cstep[i]);
Ypos[i]+=sy;
Xpos[i]+=sx;
if (Ypos[i] < 0 ){
Ypos[i]=WinHeight+60;
Xpos[i]=Math.round(Math.random()*WinWidth);
Speed[i]=(Math.random()*5+3)*-1;
}
if (ns){
document.layers['sn'+i].left=Xpos[i]+wscrll;
document.layers['sn'+i].top=Ypos[i]+hscrll;
}
else if (ns6){
document.getElementById("si"+i).style.left=Math.min(WinWidth,Xpos[i])+wscrll+'px';
document.getElementById("si"+i).style.top=Ypos[i]+hscrll-100+'px';
}
else{
document.all["si"+i].style.left=Xpos[i]+wscrll+'px';
document.all["si"+i].style.top=Ypos[i]+hscrll+'px';
}
Cstep[i]+=Step[i];
}
setTimeout('fall()',speed);
}
window.onload=fall
//-->
</script>
Thanks in advance for looking at this.
-
Is this it...this is what I have used in the past:
<!--Simply copy and paste into <BODY>
Just above the </BODY> tag. -->
<SCRIPT type="text/javascript">
/*
Snow Fall Java Script
Visit http://rainbow.arch.scriptmania.com/scripts/
for this script and many more
*/
//Pre-loads your image/s below
//Configure below - change URL path to the snow image
grphcs=new Array(6)
Image0=new Image();
Image0.src=grphcs[0]=" put your image url here";
Image1=new Image();
Image1.src=grphcs[1]="put your image url here"
Image2=new Image();
Image2.src=grphcs[2]=" put your image url here"
Image3=new Image();
Image3.src=grphcs[3]=" put your image url here"
Image4=new Image();
Image4.src=grphcs[4]=" put your image url here"
Image5=new Image();
Image5.src=grphcs[5]=" put your image url here"
//Smoothness depends on image file size,
//the smaller the size the more you can use!
// Configure below - change number of snow to render
Amount=40;
Ypos=new Array();
Xpos=new Array();
Speed=new Array();
Step=new Array();
Cstep=new Array();
ns=(document.layers)?1:0;
ns6=(document.getElementById&&!document.all)?1:0;
if (ns){
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");
}
}
else{
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < Amount; i++){
var P=Math.floor(Math.random()*grphcs.length);
rndPic=grphcs[P];
document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
}
document.write('</div></div>');
}
WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;
WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;
for (i=0; i < Amount; i++){
Ypos = Math.round(Math.random()*WinHeight);
Xpos = Math.round(Math.random()*WinWidth);
Speed= Math.random()*5+3;
Cstep=0;
Step=Math.random()*0.1+0.05;
}
function fall(){
var WinHeight=(ns||ns6)?window.innerHeight:window.document.body.clientHeight;
var WinWidth=(ns||ns6)?window.innerWidth-70:window.document.body.clientWidth;
var hscrll=(ns||ns6)?window.pageYOffset:document.body.scrollTop;
var wscrll=(ns||ns6)?window.pageXOffset:document.body.scrollLeft;
for (i=0; i < Amount; i++){
sy = Speed*Math.sin(90*Math.PI/180);
sx = Speed*Math.cos(Cstep);
Ypos+=sy;
Xpos+=sx;
if (Ypos > WinHeight){
Ypos=-60;
Xpos=Math.round(Math.random()*WinWidth);
Speed=Math.random()*5+3;
}
if (ns){
document.layers['sn'+i].left=Xpos;
document.layers['sn'+i].top=Ypos+hscrll;
}
else if (ns6){
document.getElementById("si"+i).style.left=Math.min(WinWidth,Xpos);
document.getElementById("si"+i).style.top=Ypos+hscrll;
}
else{
eval("document.all.si"+i).style.left=Xpos;
eval("document.all.si"+i).style.top=Ypos+hscrll;
}
Cstep+=Step;
}
setTimeout('fall()',115);
}
window.onload=fall
//-->
</SCRIPT>
-
Sorry, it doesn't work in Firefox. Images just sit in the corner and won't move. Doesn't work very good on IE either.
-
Put it in the footers
<script language="JavaScript1.2">
//Configure below to change URL path to the snow image
var snowsrc="IMAGE URL"
// Configure below to change number of snow to render
var no = 10;
var ns4up = (document.layers) ? 1 : 0; // browser sniffer
var ie4up = (document.all) ? 1 : 0;
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 (ns4up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
} else if (ie4up) {
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
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 (ns4up) { // set layers
if (i == 0) {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\"><a href=\"http://dynamicdrive.com/\"><img src='"+snowsrc+"' border=\"0\"></a></layer>");
} else {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\"><img src='"+snowsrc+"' border=\"0\"></layer>");
}
} else if (ie4up) {
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 snowNS() { // Netscape main animation function
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();
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
dx[i] += stx[i];
document.layers["dot"+i].top = yp[i];
document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);
}
setTimeout("snowNS()", 10);
}
function snowIE() { // IE main animation function
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();
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx[i] += stx[i];
document.all["dot"+i].style.pixelTop = yp[i];
document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);
}
setTimeout("snowIE()", 10);
}
if (ns4up) {
snowNS();
} else if (ie4up) {
snowIE();
}
</script>
It only works on IE, and I tested the code it should work.
-
I tried it in IE, Stewie, and in the headers, and it works there. I need it to work in both browsers. Not everyone uses just IE and I want my members to have the full effects. The code I posted DOES work in both, it just goes the wrong way.
-
Sorry, it doesn't work in Firefox. Images just sit in the corner and won't move. Doesn't work very good on IE either.
Sorry...I don't use firefox...and seems weird on IE cos it worked great for me...lol.
-
Yeah, codes are strange little buggers. I am hoping we can get this to be something that will work for everyone. Christmas is coming and everyone likes to see snow if they don't have to be out in it. ;)
-
Hey LL have you tried this one? I think I posted this one here a long while ago (not sure) but it worked on IE and FF if I remember correctly.
http://www.hypergurl.com/snowmaker.html
-
That one works great for FF.
-
Not on my machine on either one. Guess I will just use the code that does work and have the snow fall up.