[Resolvido] Conteúdo lê no Firefox mas não no IE e Chrome

cazuza · June 8, 2012 at 10:02 AM

Olá Pessoal!

Sou novo registado por aqui, apesar de já consultar o site há algum tempo. Nos últimos tempos fui deparado com uma situação...

Tenho apenas bases de html, css e actionscript (preferencialmente o 2) mas ultimamente foi-me proposto fazer aqui um slider no qual tive de recorrer a jquery. Como não tenho conhecimentos nesta área baseei-me num slider já feito o qual personalizei para fazer o que pretendia. Acontece que este slider apenas funciona correctamente no Firefox...sendo que no Chrome só lê o Background do CSS e no IE o mesmo mais os botões de navegação.

Será que alguém me poderá ajudar a desvendar qual a solução para isto?

A página em questão...

www.********.pt/pt/applestore.html

Será que tem alguma coisa a ver com estar ligada ao php? É que em html apenas isto funciona correctamente...

Por favor vejam o código fonte e digam-me como poderei contornar a questão...se não for pedir muito...

ps: Baseei-me neste slider... http://slidesjs.com/

ps2: Peço desculpa se fiz algum procedimento mal em abrir o tópico...

Desde já obrigado.

pikax · June 8, 2012 at 10:15 AM

Será que tem alguma coisa a ver com estar ligada ao php? É que em html apenas isto funciona correctamente...

Por favor vejam o código fonte e digam-me como poderei contornar a questão...se não for pedir muito...

Nao devia de ser problema em php, mas se meteres as imagens com html funciona, entao pode ser algum problema com o teu codigo php, pode ser que estejas a imprimir mal os nomes das imagens.

Ja' agora, nao funciona no FF 3.6

HappyHippyHippo · June 8, 2012 at 10:16 AM

a tua página está a dar erros de javascript, e deverá ser por isos que o script nem sequer corre ..

no entanto no exemplo online e no único exemplo que me dei ao trabalho de abrir os slides tem esta estrutura:

<div id="slides">
 <div class="slides_container">
   <div>...</div>
 </div>
</div>

o teu código não tem o div interior ... tem imediatamente um tag a

será muito estranho ser disso mas quem sabe ... não conheço o código javascript do slider

cazuza · June 8, 2012 at 10:32 AM

Nao devia de ser problema em php, mas se meteres as imagens com html funciona, entao pode ser algum problema com o teu codigo php, pode ser que estejas a imprimir mal os nomes das imagens.

Ja' agora, nao funciona no FF 3.6

Pois, eu também não tenho grandes conhecimentos de php..aliás, nem iniciante se possa dizer que sou...por isso não consigo compreender onde possa estar o erro :S

Eu tenho a versão 13 do FF...e isso é uma novidade que me estás a dar...pelo que vejo isto não vai é funcionar em nenhum :S ...pelo menos da forma que está...

a tua página está a dar erros de javascript, e deverá ser por isos que o script nem sequer corre ..

no entanto no exemplo online e no único exemplo que me dei ao trabalho de abrir os slides tem esta estrutura:
<div id="slides">
 <div class="slides_container">
<div>...</div>
 </div>
</div>
o teu código não tem o div interior ... tem imediatamente um tag a

será muito estranho ser disso mas quem sabe ... não conheço o código javascript do slider

Talvez seja por não estares a conseguir visualizar o conteúdo que te aparece isso...mas eu tenho divs dentro da "slides_container".

Obrigado aos dois por tentarem ajudar...

pikax · June 8, 2012 at 10:35 AM

Pois, eu também não tenho grandes conhecimentos de php..aliás, nem iniciante se possa dizer que sou...por isso não consigo compreender onde possa estar o erro :S

Podias postar o codigo de impressao das imagens...

Talvez seja por não estares a conseguir visualizar o conteúdo que te aparece isso...mas eu tenho divs dentro da "slides_container".

Eu nao estou no meu pc, por isso nao sei se estas com algum problema no javascript como o HappyHippyHippo disse, instala o web developer (addon para o FF) e verifica qual e' o erro

HappyHippyHippo · June 8, 2012 at 10:37 AM

o problema não tem nada haver com php ... não existe nenhum pedido assincrono.

o problema deve mesmo estar no erro de javascript que termina toda a execução.

depois de resolveres esse problema diz qualquer coisa

pikax · June 8, 2012 at 10:39 AM

o problema não tem nada haver com php ... não existe nenhum pedido assincrono.

o problema deve mesmo estar no erro de javascript que termina toda a execução.

depois de resolveres esse problema diz qualquer coisa

tambem fiquei um pouco supreendido quando ele disse:

Será que tem alguma coisa a ver com estar ligada ao php? É que em html apenas isto funciona correctamente...

pensei que podesse estar a imprimir errado o url da imagem

cazuza · June 8, 2012 at 10:50 AM

Head

<link rel="stylesheet" href="templates/<?php echo $this->template ?>/css/global.css" type="text/css" />

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js%22></script>
<script src="http://gsgd.co.uk/sandbox/jquery/easing/jquery.easing.1.3.js%22></script>

<script src="templates/<?php echo $this->template ?>/functions/slides.min.jquery.js" type="text/javascript"></script>
 <script>

 $(function(){
  $('#slides').slides({
preload: true,
preloadImage: 'http://www.********.pt/imgs/ipad/loading.gif'
play: 5000,
pause: 2500,
hoverPause: true
  });
 });

</script>

no body

<div id="container">
		<div id="example">
		<div id="slides">
		<div class="slides_container"><a href="..." title="Menu - App *****" target="_blank"><img width="453" height="334" src="http://www.********.pt/imgs/ipad/b1.jpg" alt="Slide 1" /></a>	  <a href="..." title="Catálogos - App *****" target="_blank"><img width="453" height="334" alt="" src="http://www.********.pt/imgs/ipad/b2.jpg" allide="" /></a>						  <a href="http://www.flickr.com/photos/childofwar/2984345060/" title="Preço do Metal - App *****" app="" target="_blank"><img width="453" height="334" src="http://www.********.pt/imgs/ipad/b3.jpg" alt="Slide 3" /></a></div>
		<a href="#" class="prev"><img width="21" height="38" src="http://www.********.pt/imgs/ipad//arrow-next.png" alt="Arrow Prev" /></a>	 <a href="#" class="next"><img width="21" height="38 alt=" alt="" src="http://www.********.pt/imgs/ipad//arrow-prev.png" arrow="" /></a></div>
		</div>
		</div>

CSS

#container {
width:540px;
overflow:hidden;
background-image:url('http://www.********.pt/imgs/ipad/fundoipad.png');
background-repeat:no-repeat;
padding:5px;
margin:0 auto;
position:relative;
z-index:0;
}

#example {
height:418px;
width:450px;
position:relative;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-top-color: #fff;
border-right-color: #fff;
border-bottom-color: #fff;
border-left-color: #fff;
margin: auto;
left: -7px;
top:23px;
}
#ribbon {
position:absolute;
top:-3px;
left:-15px;
z-index:500;
}
#frame {
position:absolute;
z-index:0;
width:500px;
height:300px;
top:-3px;
left:-80px;
}

/*
Slideshow
*/
#slides {
position:absolute;
top:21px;
left:6px;
z-index:100;
}
/*
Slides container
Important:
Set the width of your slides container
Set to display none, prevents content flash
*/
.slides_container {
width:453px;
overflow:hidden;
position:relative;
display:none;

}
/*
Each slide
Important:
Set the width of your slides
If height not specified height will be set by the slide content
Set to display block
*/
.slides_container a {
width:570px;
height:333px;
display:block;

}
.slides_container a img {
display:block;


}
/*
Next/prev buttons
*/
#slides .next,#slides .prev {
position:absolute;
top:142px;
left:0px;
width:21px;
height:38px;
display:block;
z-index:101;
}
#slides .next {
left:432px;
}
/*
Pagination
*/
.pagination {
margin:14px auto 0;
width:50px;

}
.pagination li {
float:left;
margin:0 1px;
list-style:none;
}
.pagination li a {
display:block;
width:12px;
height:0;
padding-top:12px;
background-image:url(../img/pagination.png);
background-position:0 0;
float:left;
overflow:hidden;
}
.pagination li.current a {
background-position:0 -12px;
}
/*
Footer

#footer {
text-align:center;
width:580px;
margin-top:9px;
padding:4.5px 0 18px;
border-top:1px solid #dfdfdf;
}
#footer p {
margin:4.5px 0;
font-size:1.0em;
}
*/
/*
Anchors
*/
a:link,a:visited {
color:#599100;
text-decoration:none;
}
a:hover,a:active {
color:#599100;
text-decoration:underline;
}

Quando eu disse que poderia ser do php...peço desculpa pela nabice...mas na verdade é que o mesmo conteúdo em html apenas funciona bem...acho 😛

HappyHippyHippo · June 8, 2012 at 10:58 AM

já disse e vai ser a última vez ... ou corriges os teus erros de javascript ou vais andar nisto toda a vida !!!!

cazuza · June 8, 2012 at 11:22 AM

Desviando o facto de ter informado que não tinha conhecimentos nesta área, parece que não estás a ajudar-me da melhor forma. Talvez se eu estivesse no teu lado diria...Tens estes erros...tenta corrigi-los de forma x para posteriormente verificar se poderá ser daí que o slider não funciona. Dizer-me que eu tenho erros de javascript...e dizer que vou andar nisto a vida toda, como deves calcular, para uma pessoa que não tem conhecimentos na área, é quase o mesmo que um burro a olhar para um palácio. Desculpa se estou a responder de forma menos correcta, mas não consigo mesmo entender a tua última participação no tópico e a mostrar uma imagem de que eu me estou a baldar para isto quando outros utilizadores tentarem vir ajudar. Não estou com isto a dizer que alguém é obrigado a ajudar-me...longe disso...

Se alguém precisar de mais esclarecimentos para me ajudar estou disponível... 🙂

HappyHippyHippo · June 8, 2012 at 11:31 AM

ok ... eu só respondi daquela forma porque foi o 3º post a dizer para corrigires os erros sem nenhuma resposta da tua parte

1º - não tentes misturar bibliotecas de javascript, isto porque tens jquery e mootools na mesma página .. isso é o primeiro passo para dar bronca

2º - depois de escolher uma arranja um grupo de bibliotecas de funcionalidades que necessitas com base na mesma biblioteca (jquery ou mootools)

3º - faz download de plugin firebug (visto usares o firefox) e instala

4º - recria a página por passos tentando sempre nunca ter erros (sejam erros apresentados pelo firebug ou por esta página)

caso depois disso continuares com problemas, então diz qualquer coisa que verificarei novamente o site

pikax · June 8, 2012 at 01:15 PM

os erros que me dao com o "Web Developer" foram estes:

Timestamp: 08-06-2012 14:16:18

Error: Image corrupt or truncated: <unknown>

Source File: <unknown>

Line: 0

Timestamp: 08-06-2012 14:16:18

Error: stLight is not defined

Source File: http://www.********.pt/pt/applestore.html#

Line: 26

Timestamp: 08-06-2012 14:16:18

Error: d.prototype is undefined

Source File: http://www.********.pt/pt/slimbox/js/mootools.js

Line: 3

Timestamp: 08-06-2012 14:16:21

Error: too much recursion

Source File: http://www.********.pt/pt/slimbox/js/mootools.js

Line: 3

cazuza · June 11, 2012 at 01:47 PM

Bem, através de muita pesquisa lá conseguir por aquilo a dar em todos os exploradores...

Baseei-me neste comentário que encontrei num fórum e aqui resolveu problema...

you need to add a dummy (empty) js file somewhere in one of you directories. I placed mine in my custom template js folder. Then you need to add the following code above the <jdoc:include type="head" /> tag in your template index.php file:
<?php

$headerstuff = $this->getHeadData();

$headerstuff['scripts'] = array('/path/to/empty/js-file.js'=> array ('mime' =>'text/javascript','defer'=>'','async'=>''));

$this->setHeadData($headerstuff);

?>

The above code will remove all of the mootools' js files and place the correct mime type in the type="" holder of the script tag (for the dummy js file you're now calling).

Remember, in the code above, where it says "/path/to/empty/js-file.js", this is WHERE YOU NEED TO PUT YOUR OWN PATH to the dummy js file you're calling.

Hope it helps guys--- it worked for me!

Agora vou masé tratar de corrigir os vários erros do site...alguns que não percebo mesmo...mas pronto...a internet é uma ferramenta valiosa!

cazuza · June 13, 2012 at 01:05 PM

http://www.********.pt/pt/applestore.html

Conseguem todos ver a página?

Vêem algum erro na página???

Obrigado desde já

HappyHippyHippo · June 13, 2012 at 01:35 PM

404 : http://www.********.pt/pt/SpryAssets/SpryMenuBarDownHover.gif

404 : http://www.********.pt/pt/SpryAssets/SpryMenuBarRightHover.gif

cazuza · June 13, 2012 at 01:51 PM

Hum, não é um erro importante mas vou já averiguar isso...

Obrigado pela ajuda 🙂

brunoais · June 13, 2012 at 02:52 PM

http://www.********.pt/pt/applestore.html

Conseguem todos ver a página?

Eu consigo.

Vêem algum erro na página???

Sim.

stLight is not defined @ http://www.********.pt/pt/applestore.html:28

Obrigado desde já

D nda.

cazuza · June 13, 2012 at 03:13 PM

Estão a ver os erros em que debugger? Ou em que sítio?

brunoais · June 13, 2012 at 04:16 PM

Estão a ver os erros em que debugger? Ou em que sítio?

Eu estou a ver com o javascript console do Chrome e com o web console do firefox.

Já agora:

Your code's messed up, dude! (O teu código tem problemas/erros)

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.*****.pt%2Fpt%2Fapplestore.html&charset=%28detect+automatically%29&doctype=Inline&group=0&verbose=1

cazuza · June 13, 2012 at 04:37 PM

Sim, eu estou a par desses erros...

Mas é tranquilo que são de fácil resolução..pelo menos os 3 últimos...

os dois primeiros não sei como resolver.!

Sign In

[Resolvido] Conteúdo lê no Firefox mas não no IE e Chrome

Recommended Posts

cazuza

pikax

HappyHippyHippo

cazuza

pikax

HappyHippyHippo

pikax

cazuza

HappyHippyHippo

cazuza

HappyHippyHippo

pikax

cazuza

cazuza

HappyHippyHippo

cazuza

brunoais

cazuza

brunoais

cazuza

Create an account or sign in to comment

Create an account

Sign in

Home

Activity

Revista PROGRAMAR

Important Information