PDA

View Full Version : Ultimate Fade-in slideshow (v2.1) change default image on completion of rotation.



Beachcomber
01-17-2010, 12:32 AM
1) Script Title: Ultimate Fade-in slideshow (v2.1)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

3) Describe problem:
I am a newbie at slideshows. I have added the Ultimate Fade-in slideshow on my website. I am using about 6 images in the slideshow for a header. Because of the size of the images, the first image is slow in loading. However, the last image I am using in the list is a much smaller image.

So I wonder if it possible is to use the smaller image as the first image to load, rotate the images twice, then stop the rotation at the second image in the list (the original first image which is the main image of the header)?

If this possible, I would very much appreciate instructions for a newbie to change the coding. Thank you in advance.

jscheuer1
01-17-2010, 05:30 PM
Easy, here's a demo of the kind of on page init that will do that (important parts highlighted):


var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [468, 500], //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://stickmanlabs.com/images/kevin_vegas.jpg"],
["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:'auto', pause:2500, cycles:2, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: "",
oninit: function(){
++this.setting.totalsteps

}
})

Be sure not to miss the added comma (red) after the togglerid entry.

Just make your smaller image the first image, and your larger one the second. The show will cycle through twice, then advance to the second image and stop.

Beachcomber
01-19-2010, 03:53 AM
Thank you very much John

Very much appreciated by me in sunny NZ