Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Javascript compatibility problem with disco background effect (works on IE but not FF)

  • 5 replies
  • 9 have this problem
  • 1 view
  • Last reply by cor-el

more options

This is the code:

r=255; g=255; b=255; flag=0; t=new Array; o=new Array; d=new Array;

function hex(a,c) { t[a]=Math.floor(c/16) o[a]=c%16 switch (t[a]) { case 10: t[a]='A'; break; case 11: t[a]='B'; break; case 12: t[a]='C'; break; case 13: t[a]='D'; break; case 14: t[a]='E'; break; case 15: t[a]='F'; break; default: break; } switch (o[a]) { case 10: o[a]='A'; break; case 11: o[a]='B'; break; case 12: o[a]='C'; break; case 13: o[a]='D'; break; case 14: o[a]='E'; break; case 15: o[a]='F'; break; default: break; } }

function ran(a,c) { if ((Math.random()>2/3||c==0)&&c<255) { c++ d[a]=2; } else { if ((Math.random()<=1/2||c==255)&&c>0) { c-- d[a]=1; } else d[a]=0; } return c } function do_it(a,c) { if ((d[a]==2&&c<255)||c==0) { c++ d[a]=2 } else if ((d[a]==1&&c>0)||c==255) { c--; d[a]=1; } if (a==3) { if (d[1]==0&&d[2]==0&&d[3]==0) flag=1 } return c } function disco() { if (flag==0) { r=ran(1, r); g=ran(2, g); b=ran(3, b); hex(1,r) hex(2,g) hex(3,b) document.body.style.background="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3] flag=50 } else { r=do_it(1, r) g=do_it(2,g) b=do_it(3,b) hex(1,r) hex(2,g) hex(3,b) document.body.style.background="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3] flag-- }

setTimeout('disco()',50) }

Can someone please tell me how to make this work in Firefox also, because I'm designing a website for which I'd love to put this as a background, but if I'm to do it, it needs to be compatible with all the major browsers.

This is the code: r=255; g=255; b=255; flag=0; t=new Array; o=new Array; d=new Array; function hex(a,c) { t[a]=Math.floor(c/16) o[a]=c%16 switch (t[a]) { case 10: t[a]='A'; break; case 11: t[a]='B'; break; case 12: t[a]='C'; break; case 13: t[a]='D'; break; case 14: t[a]='E'; break; case 15: t[a]='F'; break; default: break; } switch (o[a]) { case 10: o[a]='A'; break; case 11: o[a]='B'; break; case 12: o[a]='C'; break; case 13: o[a]='D'; break; case 14: o[a]='E'; break; case 15: o[a]='F'; break; default: break; } } function ran(a,c) { if ((Math.random()>2/3||c==0)&&c<255) { c++ d[a]=2; } else { if ((Math.random()<=1/2||c==255)&&c>0) { c-- d[a]=1; } else d[a]=0; } return c } function do_it(a,c) { if ((d[a]==2&&c<255)||c==0) { c++ d[a]=2 } else if ((d[a]==1&&c>0)||c==255) { c--; d[a]=1; } if (a==3) { if (d[1]==0&&d[2]==0&&d[3]==0) flag=1 } return c } function disco() { if (flag==0) { r=ran(1, r); g=ran(2, g); b=ran(3, b); hex(1,r) hex(2,g) hex(3,b) document.body.style.background="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3] flag=50 } else { r=do_it(1, r) g=do_it(2,g) b=do_it(3,b) hex(1,r) hex(2,g) hex(3,b) document.body.style.background="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3] flag-- } setTimeout('disco()',50) } Can someone please tell me how to make this work in Firefox also, because I'm designing a website for which I'd love to put this as a background, but if I'm to do it, it needs to be compatible with all the major browsers.

Chosen solution

Seems to be working here. Be careful using % in c%16 -> c % 16. Otherwise %16 might get unescaped.

data:text/html;charset=utf-8,
<html>
<head>
<script>
var r=255,g=255,b=255,flag=0,t=new Array,o=new Array,d=new Array;

function hex(a,c) {
t[a]=Math.floor(c/16);o[a]=c % 16;
switch (t[a]) {
case 10:t[a]='A';break;
case 11:t[a]='B';break;
case 12:t[a]='C';break;
case 13:t[a]='D';break;
case 14:t[a]='E';break;
case 15:t[a]='F';break;
default:break;
}
switch (o[a]) {
case 10:o[a]='A';break;
case 11:o[a]='B';break;
case 12:o[a]='C';break;
case 13:o[a]='D';break;
case 14:o[a]='E';break;
case 15:o[a]='F';break;
default:break;
}
}

function ran(a,c) {
if ((Math.random()> 2/3 || c==0) && c<255){c++;d[a]=2;}
else{if ((Math.random() <= 1/2 || c==255) && c>0){c--;d[a]=1;}else d[a]=0;}
return c
}

function do_it(a,c) {
if ((d[a]==2 && c<255)|| c==0){c++;d[a]=2;}
else if ((d[a]==1 && c>0) || c==255){c--;d[a]=1;}
if (a==3) {if (d[1]==0 && d[2]==0 && d[3]==0)flag=1;}
return c
}

function disco() {
if (flag==0) {
r=ran(1, r);g=ran(2, g);b=ran(3, b);
hex(1,r);hex(2,g);hex(3,b);
document.body.style.background="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3];
flag=50;
}
else {
r=do_it(1, r);g=do_it(2,g);b=do_it(3,b);
hex(1,r);hex(2,g);hex(3,b);
document.body.style.background="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3];
flag--;
}
setTimeout('disco()',50);
}
</script>
</head>
<body style="height:100%;" onload="disco();">
</body>
</html>
Read this answer in context 👍 1

All Replies (5)

more options

Chosen Solution

Seems to be working here. Be careful using % in c%16 -> c % 16. Otherwise %16 might get unescaped.

data:text/html;charset=utf-8,
<html>
<head>
<script>
var r=255,g=255,b=255,flag=0,t=new Array,o=new Array,d=new Array;

function hex(a,c) {
t[a]=Math.floor(c/16);o[a]=c % 16;
switch (t[a]) {
case 10:t[a]='A';break;
case 11:t[a]='B';break;
case 12:t[a]='C';break;
case 13:t[a]='D';break;
case 14:t[a]='E';break;
case 15:t[a]='F';break;
default:break;
}
switch (o[a]) {
case 10:o[a]='A';break;
case 11:o[a]='B';break;
case 12:o[a]='C';break;
case 13:o[a]='D';break;
case 14:o[a]='E';break;
case 15:o[a]='F';break;
default:break;
}
}

function ran(a,c) {
if ((Math.random()> 2/3 || c==0) && c<255){c++;d[a]=2;}
else{if ((Math.random() <= 1/2 || c==255) && c>0){c--;d[a]=1;}else d[a]=0;}
return c
}

function do_it(a,c) {
if ((d[a]==2 && c<255)|| c==0){c++;d[a]=2;}
else if ((d[a]==1 && c>0) || c==255){c--;d[a]=1;}
if (a==3) {if (d[1]==0 && d[2]==0 && d[3]==0)flag=1;}
return c
}

function disco() {
if (flag==0) {
r=ran(1, r);g=ran(2, g);b=ran(3, b);
hex(1,r);hex(2,g);hex(3,b);
document.body.style.background="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3];
flag=50;
}
else {
r=do_it(1, r);g=do_it(2,g);b=do_it(3,b);
hex(1,r);hex(2,g);hex(3,b);
document.body.style.background="#"+t[1]+o[1]+t[2]+o[2]+t[3]+o[3];
flag--;
}
setTimeout('disco()',50);
}
</script>
</head>
<body style="height:100%;" onload="disco();">
</body>
</html>

Modified by cor-el

more options

Wow! Thanks a lot. Now it works in FF :-)

But only downside is it no longer works in IE. We all know IE doesn't follow W3C standards (transparency is such a pain in IE because it doesn't use rbga colors) and it's pretty much off its rocker, but this is just crazy.

Can you please, by any chance make your code run for both IE and FF or do I need to detect browser and run one of the two scripts according to the user's browser?

more options

I'm on Linux, so can't test it in IE. I would assume that only document.body.style.background could cause problems in IE. The rest is pretty standard. I only added some spaces and semicolons to make your code work as a data URI to test it.

A good place to ask questions and advice about web development is at the mozillaZine Web Development/Standards Evangelism forum.
The helpers at that forum are more knowledgeable about web development issues.
You need to register at the mozillaZine forum site in order to post at that forum.
See http://forums.mozillazine.org/viewforum.php?f=25

more options

Thanks a lot for your great help :-) I just used JavaScript to run your corrected script for FF users and the old one that ran on IE for IE users and so it's functioning just fine. I will look into the forums as you said for a more technical response regarding this. Thanks a million.