Código não funciona no Firefox/Chrome

EdgarSJ · Outubro 31, 2012

Olá pessoal do Javascript..

Eu to mais acostumado com PHP, então queria ver se vcs podem me ajudar com esse código que faz uma firula na página, tipo aquele antigo screen saver de janelas voadoras do Windows.

O problema é que este código não funciona no Firefox nem Chrome, apenas no IE.

Segue o código adaptado por Mikhail Ansolis:

http://www.dynamicdr...3/starfield.htm

<script language="Javascript1.2">

//3D Starfield - by Mikhail Ansolis, based on Flying planes - by John Ely
//Modified from: Autumn leaves script- by Kurt Grigg (kurt.grigg@virgin.net)
//Visit http://www.dynamicdrive.com for this script

//Pre-load your image below!
//CHANGE 5 to the number of images listed below
grphcs=new Array(5)

//PRELOAD the involved images (extend or contract variables according to # of images used)
Image0=new Image();
Image0.src=grphcs[0]="Star0.gif"
Image1=new Image();
Image1.src=grphcs[1]="Star1.gif"
Image2=new Image();
Image2.src=grphcs[2]="Star2.gif"
Image3=new Image();
Image3.src=grphcs[3]="Star3.gif"
Image4=new Image();
Image4.src=grphcs[4]="Star4.gif"

//SPECIFY number of images to randomly display concurrently from list above. Less the more efficient
Amount=20;
Ypos=new Array();
Xpos=new Array();
Zpos=new Array();
//SpeedX=new Array();
//SpeedY=new Array();
ScrXpos=new Array();
ScrYpos=new Array();
Speed=new Array();
Size=new Array();
Step=new Array();
ns=(document.layers)?1:0;
ie=document.all&&navigator.userAgent.indexOf("Opera")==-1

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>");
} //end for
} //end if
else if (ie){ //IE
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < Amount; i++){
document.write('<img id="si'+i+'" src="'+grphcs[Math.round((i+1)*(grphcs.length-1)/Amount)]+'"style="position:absolute;top:0px;left:0px">');
}
document.write('</div></div>');
}

//initialize star properties
if (ie||ns){
WinHeight=(ns)?window.innerHeight-20:window.document.body.clientHeight;
WinWidth=(ns)?window.innerWidth-70:window.document.body.clientWidth;
for (i=0; i < Amount; i++){
Speed[i]=(i+1)*6/Amount+4; //speed range from 4 to 10
Xpos[i] = (Math.random()*WinWidth-WinWidth/2)*(Amount-i/3)/Amount;
Ypos[i] = (Math.random()*WinHeight-WinHeight/2)*(Amount-i/3)/Amount;
Zpos[i] = Math.random()*900*(Amount-i/3)/Amount+100;
}
}

function fly(){
var WinHeight=(ns)?window.innerHeight-20:window.document.body.clientHeight;
var WinWidth=(ns)?window.innerWidth-70:window.document.body.clientWidth;
var hscrll=(ns)?window.pageYOffset:document.body.scrollTop;

for (i=0; i < Amount; i++){
Zpos[i]-=Speed[i];
if (ScrXpos[i]>WinWidth || ScrXpos[i]<0 || ScrYpos[i]>WinHeight || ScrYpos[i]<0 || Zpos[i]<=0) { //generate new stars
Speed[i]=(i+1)*6/Amount+4; //speed range from 4 to 10
Xpos[i] = (Math.random()*WinWidth-WinWidth/2)*(Amount-i/3)/Amount;
Ypos[i] = (Math.random()*WinHeight-WinHeight/2)*(Amount-i/3)/Amount;
Zpos[i] = Math.random()*900*(Amount-i/3)/Amount+100;
}
ScrXpos[i]=Xpos[i]/Zpos[i]*100 + WinWidth/2;
ScrYpos[i]=Ypos[i]/Zpos[i]*100 + WinHeight/2;

if (ns){
document.layers['sn'+i].left=ScrXpos[i];
document.layers['sn'+i].top=ScrYpos[i]+hscrll;
}
else{ //IE
eval("document.all.si"+i).style.left=ScrXpos[i];
eval("document.all.si"+i).style.top=ScrYpos[i]+hscrll;
}
} //end for
setTimeout('fly()',20);
} //end fly

if (ie||ns)
window.onload=fly
//-->
< /SCRIPT>

Porém, achei este código, que foi tomado por base, mas faz outro efeito e que funciona nos demais navegadores:

http://www.dynamicdr...ndex4/plane.htm

<script language="Javascript1.2">
//Flying planes - by John Ely
//Modified from: Autumn leaves script- by Kurt Grigg (kurt.grigg@virgin.net)
//Modified by Dynamic Drive for NS6 functionality
//visit http://www.dynamicdrive.com for this script
//Pre-load your image below!
//CHANGE 5 to the number of images listed below
grphcs=new Array(5)
//PRELOAD the involved images (extend or contract variables according to # of images used)
Image0=new Image();
Image0.src=grphcs[0]="plane0.gif"
Image1=new Image();
Image1.src=grphcs[1]="plane1.gif"
Image2=new Image();
Image2.src=grphcs[2]="plane2.gif"
Image3=new Image();
Image3.src=grphcs[3]="plane3.gif"
Image4=new Image();
Image4.src=grphcs[4]="plane4.gif"
//SPECIFY number of images to randomly display concurrently from list above. Less the more efficient
Amount=3;
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;
ie=document.all
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-70:window.document.body.clientHeight;
WinWidth=(ns||ns6)?window.innerWidth:window.document.body.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+1;
Cstep[i]=0;
Step[i]=Math.random()*0.1+0.05;
}
function fly(){
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[i]*Math.sin(Cstep[i]);
sx = Speed[i]*2;
Ypos[i]+=sy;
Xpos[i]+=sx;
if (Xpos[i] > WinWidth){
Ypos[i]=Math.round(Math.random()*WinHeight);
Xpos[i]=-60;
Speed[i]=Math.random()*5+1;
}
if (ns){
document.layers['sn'+i].left=Xpos[i]+wscrll;
document.layers['sn'+i].top=Ypos[i];
}
else if (ns6){
document.getElementById("si"+i).style.left=Xpos[i]+wscrll;
document.getElementById("si"+i).style.top=Math.min(WinHeight,Ypos[i]);
}
else{
eval("document.all.si"+i).style.left=Xpos[i]+wscrll;
eval("document.all.si"+i).style.top=Ypos[i];
}
Cstep[i]+=Step[i];
}
setTimeout('fly()',20);
}
if (ie||ns||ns6)
window.onload=fly
//-->
</script>

Alguem poderia dar uma luz de o porque o segundo funciona no FF e o primeiro não?

Gracias colegas.

Vadio · Outubro 31, 2012

onde q o cod para?

se não sabe va dando alert até onde ele parar..

qd ele para você linka as linhas dali pra baixo pra da uma olhada ak.

EdgarSJ · Outubro 31, 2012

Como assim "ele para"? Simplesmente nao aparece efeito nenhum no FF, essa foi o site que inseri esse código L!ndMidis.net, no IE aparece, nos outros não...

Desculpa minha ignorância em Javascript

Bruno Augusto · Outubro 31, 2012

Pode ser que o script possua alguma instrução específica ou exclusiva do IEca

EdgarSJ · Outubro 31, 2012

E será que consigo descobrir e substituir?

Vadio · Outubro 31, 2012

consegue.. vá add alerts no seu code

até ele parar

ex

alert(0)
grphcs= new Array()
//PRELOAD the involved images (extend or contract variables according to # of images used)
Image0=new Image();
Image0.src=grphcs[0]="Star0.gif"
Image1=new Image();
Image1.src=grphcs[1]="Star1.gif"
Image2=new Image();
Image2.src=grphcs[2]="Star2.gif"
Image3=new Image();
Image3.src=grphcs[3]="Star3.gif"
Image4=new Image();
Image4.src=grphcs[4]="Star4.gif"

alert(1)

//SPECIFY number of images to randomly display concurrently from list above. Less the more efficient
Amount=20;
Ypos=new Array();
Xpos=new Array();
Zpos=new Array();
//SpeedX=new Array();
//SpeedY=new Array();
ScrXpos=new Array();
ScrYpos=new Array();
Speed=new Array();
Size=new Array();
Step=new Array();


alert(2)

ns=(document.layers)?1:0;
ie=document.all&&navigator.userAgent.indexOf("Opera")==-1

e assim por diante vai chega uma hr ele vai parar.

se ele paro é pq o erro ta ali.. passe o cod a partir do ultimo alert apresentado pois como o Bruno Augusto falou

Pode ser que o script possua alguma instrução específica ou exclusiva do IEca

EdgarSJ · Outubro 31, 2012

O código vai até este alert(4), depois para:

 Zpos[i] = Math.random()*900*(Amount-i/3)/Amount+100;
}
}
alert(4)

function fly(){
var WinHeight=(ns)?window.innerHeight-20:window.document.body.clientHeight;
var WinWidth=(ns)?window.innerWidth-70:window.document.body.clientWidth;
var hscrll=(ns)?window.pageYOffset:document.body.scrollTop;

for (i=0; i < Amount; i++){

Será a função fly()?

Mas o segundo código no primeiro post também tem o fly() e funciona no FF...

Vadio · Outubro 31, 2012

certo agora você já sabe q o erro está dentro da função fly

agora faça o mesmo para os blocos de cod da função fly..

function fly(){
   alert(1);
   var WinHeight=(ns)?window.innerHeight-20:window.document.body.clientHeight;
   var WinWidth=(ns)?window.innerWidth-70:window.document.body.clientWidth;
   var hscrll=(ns)?window.pageYOffset:document.body.scrollTop;

   alert(2);
   for (i=0; i < Amount; i++){
       alert(3);
       Zpos[i]-=Speed[i];
       if (ScrXpos[i]>WinWidth || ScrXpos[i]<0 || ScrYpos[i]>WinHeight || ScrYpos[i]<0 || Zpos[i]<=0) { //generate new stars

           Speed[i]=(i+1)*6/Amount+4; //speed range from 4 to 10
           Xpos[i] = (Math.random()*WinWidth-WinWidth/2)*(Amount-i/3)/Amount;
           Ypos[i] = (Math.random()*WinHeight-WinHeight/2)*(Amount-i/3)/Amount;
           Zpos[i] = Math.random()*900*(Amount-i/3)/Amount+100;
           alert(4);
       }
       alert(5);
       ScrXpos[i]=Xpos[i]/Zpos[i]*100 + WinWidth/2;
       ScrYpos[i]=Ypos[i]/Zpos[i]*100 + WinHeight/2;
       alert(6);
       if (ns){

           document.layers['sn'+i].left=ScrXpos[i];
           document.layers['sn'+i].top=ScrYpos[i]+hscrll;
           alert(7);
       }else{ //IE
           eval("document.all.si"+i).style.left=ScrXpos[i];
           eval("document.all.si"+i).style.top=ScrYpos[i]+hscrll;
           alert(8);
       }

       alert(9);
   } //end for

   alert(10);
   setTimeout('fly()',20);
   alert(11);
} //end fly

você tbm pode usa o console do chrome ou o firebug do ff q ele já irão identificar a linha e a "rota" do erro..

mto mais facil. mas nem sempre esses console funciona..

EdgarSJ · Novembro 1, 2012

Fiz como o Vadio sugeriu para cercar o problema, e coloquei um alert(0) antes do fly(), e nao adianta, nao passa desse ponto, não chega no alert(1)..

alert(0)
function fly(){
   alert(1);
   var WinHeight=(ns)?window.innerHeight-20:window.document.body.clientHeight;
   var WinWidth=(ns)?window.innerWidth-70:window.document.body.clientWidth;
   var hscrll=(ns)?window.pageYOffset:document.body.scrollTop;

   alert(2);
.
.
.

Pelo Console do Chrome só mostra esse "erro" do código do Google Adsense

Unsafe JavaScript attempt to access frame with URL http://lindmidis.net/indexteste.htm from frame with URL http://googleads.g.doubleclick.net/page....
....xlKzM7&p=http%3A//lindmidis.net. Domains, protocols and ports must match.

Vadio · Novembro 2, 2012

então o "fly" não está nem sendo chamado.. remova o code do google ads. e refaça os testes...

EdgarSJ · Novembro 3, 2012

Mesmo sem o adsense não funciona...

Bruno Augusto · Novembro 3, 2012

então o "fly" não está nem sendo chamado.. remova o code do google ads. e refaça os testes...

Exato, a função fly() sequer está sendo invocada. Isso porque sua invocação está condicionada à uma de duas variáveis, ns ou ie

Se você der um alert() em ambas as variáveis, no Chrome pelo menos, verá um undefined para o ie e 0 (zero) para ns. Ou seja, para o Chrome, o ambiente não é nem Netscape Navigator (ou derivados) e nem Internet Explorer.

Removendo essa condição:

//if (ie||ns)

O código passa a ser executado e apresenta um erro no Console:

Uncaught TypeError: Cannot read property 'style' of undefined - Starfield3D.htm:87

Inspecionando o código temos:

if (ns){
 document.layers['sn'+i].left=ScrXpos[i];
 document.layers['sn'+i].top=ScrYpos[i]+hscrll;
}
else{ //IE
 eval("document.all.si"+i).style.left=ScrXpos[i];
// Uncaught TypeError: Cannot read property 'style' of undefined
 eval("document.all.si"+i).style.top=ScrYpos[i]+hscrll;
}

O erro ora apresentado está na linha comentada.

Como a variável ns retornou zero para o Chrome, o fluxo caiu no else que é exclusivo para o IE por causa do document.all creio eu.

Se eu fosse você eu esquecia desse código porque é muito antigo (assim como muita coisa do DynamicDrive) e incompatível com os browser modernos.

Sem contar que é um efeito feio e bastante amador.

EdgarSJ · Novembro 3, 2012

Olá Bruno,

Concordo contigo que o efeito é amador, mas a dona do site quer porque quer. Mas você viu a saída usada no segundo código para funcionar no IE? Pelo menos eu acho que foi isso...

ns=(document.layers)?1:0;
ns6=(document.getElementById&&!document.all)?1:0;
ie=document.all

Já tentei inserir, mas não deu certo.

E já procurei um código mais recente para esse efeito, mas ainda não achei...

Arquivado

Código não funciona no Firefox/Chrome

Recommended Posts

EdgarSJ 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vadio 13

Compartilhar este post

Link para o post

Compartilhar em outros sites

EdgarSJ 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Bruno Augusto 417

Compartilhar este post

Link para o post

Compartilhar em outros sites

EdgarSJ 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vadio 13

Compartilhar este post

Link para o post

Compartilhar em outros sites

EdgarSJ 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vadio 13

Compartilhar este post

Link para o post

Compartilhar em outros sites

EdgarSJ 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vadio 13

Compartilhar este post

Link para o post

Compartilhar em outros sites

EdgarSJ 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Bruno Augusto 417

Compartilhar este post

Link para o post

Compartilhar em outros sites

EdgarSJ 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Fóruns

Tempo Real

Informação importante