Slideshow com comentários

[cristyan 0]

Bom galera.. Gostaria de uma ajuda pra o seguinte:

 

tenho esse script abaixo para um slideshow.. queria cada foto tivesse um comentário.. ao trocar a foto trocasse o comentário tb..

 

tem o array das imagens. tentei criar um array com os comentários mas não consegui implementar junto ao slide show..

 

quem poder dar uma força, agradeço..

 

 

<script type="text/javascript">

var slidespeed=5000
var slideimages=new Array("dia1.png","dia2.png","dia3.png")

var whichlink=0
var whichimage=0
var imgobj, filtersupport, blenddelay
var imageholder=new Array()
for (i=0;i<slideimages.length;i++){ //preload images
imageholder[i]=new Image()
imageholder[i].src=slideimages[i]
}

function gotoshow(){
window.location=slidelinks[whichlink]
}

function slideit(){
if (filtersupport)
imgobj.filters[0].apply()
imgobj.src=imageholder[whichimage].src
if (filtersupport)
imgobj.filters[0].play()
whichlink=whichimage
whichimage=(whichimage<slideimages.length-1)? whichimage+1 : 0
setTimeout("slideit()", slidespeed+blenddelay)
}

window.onload=function(){
imgobj=document.getElementById("slideshow") //access img obj
filtersupport=imgobj.filters //check for support for filters
blenddelay=(filtersupport)? imgobj.filters[0].duration*500 : 0
slideit()
alteraLabel(texts)
}


</script>		  
<img src='carregar.gif' border='0' vspace='1' id='slideshow' style='filter:progid:DXImageTransform.Microsoft.Fade(duration=1)'>

[peder 0]

Faz uma lista com os comentarios de cada foto e deixa ela invisivel

p mostra o comentario, pode usar <p>

<p id="comentario"></p>

ai cada vez q mudar a imagem você pega o conteudo da lista e coloca no <p>

por exemplo:

document.getElementById("comentario").innerHTML=document.getElementsByTagName("li")[n].innerHTML;

onde n é o indice ou numero da foto

[cristyan 0]

:(

 

não consegui

[peder 0]

você tambem pode pegar o alt da imagem mostrada

 

por exemplo:

 

document.getElementById('comentario').innerHTML=document.getElementById('slideshow').alt;

[cristyan 0]

Solução

 

<script type="text/javascript">

var slidespeed=2000;


var slideimages = new Array("reto.gif", "virado.gif", "preto.gif");
var textos = new Array("oi, tem sol lá fora..", "chuva.. :(", "aaaaaaaaaaa");
var links = new Array("1", "2", "3");

var whichlink=0;
var whichimage=0;
var imgobj, filtersupport, blenddelay;
var imageholder=new Array();
for (i=0;i<slideimages.length;i++){ //preload images
imageholder[i]=new Image();
imageholder[i].src=slideimages[i];
}

function gotoshow() {
  window.location=slidelinks[whichlink];
}

function slideit() {
  if (filtersupport)
	imgobj.filters[0].apply();
  imgobj.src=imageholder[whichimage].src;
  if (filtersupport)
	imgobj.filters[0].play();
  
  document.getElementById('texto_imagem').innerHTML = textos[whichimage];
  document.getElementById('link_da_festa').href = 'link.html?festa='+links[whichimage];  
  
  
  
  whichlink = whichimage;
  whichimage = (whichimage < slideimages.length - 1) ? whichimage + 1 : 0;
  setTimeout("slideit()", slidespeed+blenddelay);
}

window.onload=function(){
 
imgobj = document.getElementById("slideshow"); //access img obj
filtersupport = imgobj.filters; //check for support for filters
blenddelay = (filtersupport) ? imgobj.filters[0].duration*500 : 0;
slideit();

}

</script>

<a id='link_da_festa' href=''>
  <img src='carregar.gif' border='0' vspace='1' id='slideshow' style='filter:progid:DXImageTransform.Microsoft.Fade(duration=1)'>
  <span id='texto_imagem'></span>
</a>

 

mas o fade só funciona no IE, na função abaixo:

 

function slideit() {
  if (filtersupport)
	imgobj.filters[0].apply();
  imgobj.src=imageholder[whichimage].src;
  if (filtersupport)
	imgobj.filters[0].play();

p funfar no firefox, chrome etc. teria alguma opção??