Results 1 to 2 of 2

Thread: Ult fade show - tooltips and captions

  1. #1
    Join Date
    Nov 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Ult fade show - tooltips and captions

    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

  2. #2
    Join Date
    Dec 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default problem getting caption to display

    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
    }

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •