Sure, try this. In the configuration code for the slideshow (of your head section), try the following changes:
Code:
var mydesc=[
"desc 1",
"desc 2",
"desc 3",
"desc 4",
]
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow
dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://i26.tinypic.com/11l7ls0.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
["http://i30.tinypic.com/531q3n.jpg"],
["http://i31.tinypic.com/119w28m.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
],
displaymode: {type:'manual', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "always",
togglerid: "fadeshow2toggler",
onslide:function(img, index){
document.getElementById('descdiv').innerHTML=mydesc[index]
}
})
Firstly, notice the custom array you should create to store the descriptions for each slide. The descriptions inside the should be removed at the same time. Then, define the onslide() event handler in the manner above, which populates the empty DIV with ID="descdiv" on your page with the corresponding description for each slide. Be sure to change "descdiv" depending on the ID of your DIV.
Bookmarks