PDA

View Full Version : Ult fade show - tooltips and captions



lyn
11-15-2006, 05:35 PM
1) Script Title: Ultimate Fadein Show

2) Script URL (on DD):

3) Describe problem: this is a great slideshow, especially as it fades properly in Mozilla. I've added tooltips and captions to it, and if anyone is interested this is the extra scripting (with line nos added):

fadeshow.prototype.populateslide=function(picobj, picindex){
var slideHTML=""
1/if (this.theimages[picindex][1]!="") //if associated link exists for image
2/slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
3/slideHTML+='<img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px" title="'+this.theimages[picindex][3]+'">' // tooltip
4/if (this.theimages[picindex][1]!="") //if associated link exists for image
5/slideHTML+='</a>'
6/slideHTML+='<p>' // push captions down a bit
7/if (this.theimages[picindex][1]!="") // new href
8/slideHTML+='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
9/if (this.theimages[picindex][4]!="") // if caption exists for this image
10/slideHTML+='<div id="slideHTML">'+this.theimages[picindex][4]+'</div>' // the caption
11/if (this.theimages[picindex][1]!="") //if associated link exists for image
12/slideHTML+='</a>'
13/picobj.innerHTML=slideHTML
}

on ln3, this bit:
title="'+this.theimages[picindex][3]+'"
is added, whilst lines 6 to 12 inclusive are new. The captions are basically text boxes displaying under the image, and fading over as the image fades over. The array is in this format:

var fadeimages1=new Array()
fadeimages1[0]=["/path/to/image001.jpg", "URL", "", "tooltip (title)", "caption"]


Seems to work quite well. (I have two questions, but I'll post those in separate threads.)

Cheers
Lyn

pcorey
12-19-2006, 08:47 PM
I used your modified script and I can get the tooltip to display but not the caption. I've also modified the script to stop rotating after one go around - if that makes a difference. What do you think I did wrong to not get the captions to show up? Thanks for your help!

Here's my array:

var fadeimages1=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages1[0]=["pic1.jpg", "link.html", "", "photo 1", "caption"]//image with link syntax
fadeimages1[1]=["pic2.jpg", "link2.html", "", "photo 2", "caption2"] //image with link syntax
fadeimages1[2]=["pic3.jpg", "link3.html", "", "photo 3", "caption3"] //image with link syntax

And here's the modified part of the original script that I got from you:

fadeshow.prototype.populateslide=function(picobj, picindex){
var slideHTML=""
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
slideHTML+='<img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px" title="'+this.theimages[picindex][3]+'">' // tooltip
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML+='</a>'
slideHTML+='<p>' // push captions down a bit
if (this.theimages[picindex][1]!="") // new href
slideHTML+='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
if (this.theimages[picindex][4]!="") // if caption exists for this image
slideHTML+='<div id="slideHTML">'+this.theimages[picindex][4]+'</div>' // the caption
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML+='</a>'
picobj.innerHTML=slideHTML
}