Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Geovane Krüger

Trocar imagens automáticamente

Por , em Javascript

Recommended Posts

Geovane Krüger    0

Geovane Krüger
Postado

to com o seguinte código para trocar imagens no topo do site.

 

 

		<script type="text/javascript" language="javascript"> 
						var quotes=new Array() 
						quotes[0]='<img src="Imagens/Logo_saibro.png" alt=""/>'
						quotes[1]='<img src="Imagens/Logo_grama.png" alt=""/>'
						quotes[2]='<img src="Imagens/Logo_azul.png" alt=""/>'
						quotes[3]='<img src="Imagens/Logo_cinza.png" alt=""/>'
						quotes[4]='<img src="Imagens/Logo_misto.png" alt=""/>'
						quotes[5]='<img src="Imagens/Logo_wimbledon.png" alt=""/>'
						var whichquote=Math.floor(Math.random()*(quotes.length))
						document.write(quotes[whichquote])
						</script></div>

 

 

e quando mando verificar no w3 da 6 erros como esse.

 

 

 

 

Line 23, Column 60: document type does not allow element "img" here

quotes[0]='<img src="Imagens/Logo_saibro.png" alt=""/>'✉

The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

 

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).

Compartilhar este post

Link para o post
Compartilhar em outros sites

Fabio Morikawa    0

Fabio Morikawa
Postado

olá,

 

bom você terá que mudar um pouco o seu conceito...

 

coloque seu script dentro de uma funcao e na tag head...

 

dê um nome na sua div que irá ter as imagens.. como por exemplo... <div id="imgsrandon"></div>

 

e ao invés de utilizar document.write, use document.getElementById('imgsrandon').innerHTML = quotes[whichquote];

 

vai ficar mais ou menos assim...

 

<html>

<head>

<script type="text/javascript">

function ImgsRandom(){

var quotes=new Array()

quotes[0]='<img src="Imagens/Logo_saibro.png" alt=""/>';

quotes[1]='<img src="Imagens/Logo_grama.png" alt=""/>';

quotes[2]='<img src="Imagens/Logo_azul.png" alt=""/>';

quotes[3]='<img src="Imagens/Logo_cinza.png" alt=""/>';

quotes[4]='<img src="Imagens/Logo_misto.png" alt=""/>';

quotes[5]='<img src="Imagens/Logo_wimbledon.png" alt=""/>'

var whichquote=Math.floor(Math.random()*(quotes.length));

document.getElementById("imgsrandon").innerHTML = quotes[whichquote];

}

window.onload=ImgsRandom;

</script>

</head>

<body>

<div id="imgsrandon"></div>

</body>

</html>

 

 

mas o mais ideal é cria com dom...

 

ficaria assim..

 

<script type="text/javascript">

function ImgsRandom(){

var quotes=new Array()

quotes[0]='Imagens/Logo_saibro.png';

quotes[1]='Imagens/Logo_grama.png';

quotes[2]='Imagens/Logo_azul.png';

quotes[3]='Imagens/Logo_cinza.png';

quotes[4]='Imagens/Logo_misto.png';

quotes[5]='Imagens/Logo_wimbledon.png';

var whichquote=Math.floor(Math.random()*(quotes.length));

 

var img = document.createElement("img");

img.src = quotes[whichquote];

img.alt = "";

document.getElementById("imgsrandon").appendChild(img);

}

document.onload=ImgsRandom;

</script>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago Retondar    18

Thiago Retondar
Postado

Olá,

 

estou no início dos meus estudos de JavaScript - bem no início -, mas pelo que eu li em minha apostila, é recomendado colocar todos os caracteres &, < e > dentro de um comentário XHTML. Ficando assim:

 

<script type="text/javascript">
	var quotes=new Array()
	<!--
	quotes[0]='<img src="Imagens/Logo_saibro.png" alt=""/>'
	quotes[1]='<img src="Imagens/Logo_grama.png" alt=""/>'
	quotes[2]='<img src="Imagens/Logo_azul.png" alt=""/>'
	quotes[3]='<img src="Imagens/Logo_cinza.png" alt=""/>'
	quotes[4]='<img src="Imagens/Logo_misto.png" alt=""/>'
	quotes[5]='<img src="Imagens/Logo_wimbledon.png" alt=""/>'
	-->
	var whichquote=Math.floor(Math.random()*(quotes.length))
	document.write(quotes[whichquote])
</script>

Isto serve para evitar que o browser tente interpretar o conteúdo do script como se fosse XHTML, o que seria errado.

 

Isso fez com que esse código validasse, porém ficou a dúvida minha para os feras aí: Este é o método certo de fazer? Quando for colocar uma tag XHTML, deve ser colocar o comentário, <!-- -->? http://forum.imasters.com.br/public/style_emoticons/default/assobiando.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

Geovane Krüger    0

Geovane Krüger
Postado

Interessante saber disso, vlw kra, vou tentar com isso corrigir uns erros aqui nesse código que achei na net e ficou mto legal esse código para trocar imagens.

 

<script language="JavaScript">
var bannerAD=new Array();
var adNum=0;


bannerAD[0]="imagens/Logo_saibro.png";// ou digitar diretamente em cada item o nome da imagem
bannerAD[1]="imagens/Logo_grama.png";
bannerAD[2]="imagens/Logo_azul.png";
bannerAD[3]="imagens/Logo_cinza.png";
bannerAD[4]="imagens/Logo_misto.png";
bannerAD[5]="imagens/Logo_wimbledon.png";

var preloadedimages=new Array();
for (i=1;i<bannerAD.length;i++){
preloadedimages[i]=new Image();
preloadedimages[i].src=bannerAD[i];
}
function setTransition(){
if (document.all){
bannerADrotator.filters.revealTrans.Transition=Math.floor(Math.random()*23);
bannerADrotator.filters.revealTrans.apply();
}
}
function playTransition(){
if (document.all)
bannerADrotator.filters.revealTrans.play()
}
function nextAd(){
if(adNum<bannerAD.length-1)adNum++;
else adNum=0;
setTransition();
document.images.bannerADrotator.src=bannerAD[adNum];
playTransition();
theTimer=setTimeout("nextAd()", 5000);
}
function jump2url(){
jumpUrl=bannerADlink[adNum];
jumpTarget='_self';
if (jumpUrl != ''){
if (jumpTarget != '')window.open(jumpUrl,jumpTarget);
else location.href=jumpUrl;
}
}
function displayStatusMsg() { 
status=bannerADlink[adNum];
document.returnValue = true;
}
</script>


<BANNERAD><img src="../imagens/Logo_saibro.png" name="bannerADrotator" style="filter:revealTrans(duration=2,transition=20)" border=0></a>
<script language="JavaScript">nextAd()</script>
</BANNERAD>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago Retondar    18

Thiago Retondar
Postado

Então, cara, é como eu te disse, estou na espera de uma resposta de um membro mais experiente ou moderador. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

Não sei se esse é o modo correto, pois pesquisei no Google e não encontrei nada. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

Geovane Krüger    0

Geovane Krüger
Postado

Então eu usei esse negócio do comentário que você flw e usei esse código que postei depois aí e ficou zeradinho no W3 sem nenhum erro.

 

A página que to fazendo é essa

 

www.netec.ufsc.br

 

A página tá mais ou menos, comecei a estudar negócio de site por conta própria e coisas na net faz 3 semanas, sou um noob total ehehhe, mas ta saindo a página e como a pressa era urgente por causa desse congresso até ficou mais ou menos.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago de Oliveira Cruz    21

Thiago de Oliveira Cruz
Postado

Eu recomendo que você tente colocar esse código com o caminho todo em letra minuscula...

 

Pois 90% das vezes o nome das fotos com letra maiuscula pode não ser reconhecida corretamente pelo servidor... o mesmo corre as vezes quando a foto está no formato jpeg e o arquivo foi salvo como jpg... normalmente ambos são reconhecidos como imagem... mas se estiver na foto como jpeg e você chamar a imagem como jpg ele não vai encontrar e vai deixar o lugar em branco...

 

Para saber se está correto seu código ou não.

Pegue esse caminho que você colou ai para cada imagem... vá até seu site e simplesmente coloque o caminho no browser... se o caminho estiver correto a imagem vai aparecer...

Se não :) você errou no caminho.

 

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito