PDA

View Full Version : Ulitmate Fade in slideshow Questions



eglons
05-01-2006, 10:22 PM
Ultimate Fade-in slideshow
http://www.dynamicdrive.com/dynamici...nslideshow.htm


I've just discovered this script and can seeit being useful in my site, however there are 2 problems and 1 nice to have:

1. My images vary in height/width and I have text around them so setting for the maximum dimensions isn't an option, can the script resize the image div to the image being displayed?

2. I'd like to caption the images, seems like a logical requirement but I can't see it in the code

3. It would be nice to have direction arrows to change the image loading sequence and a stop button (I know the mouseover does it but it's not obvious to an end user.

Many thanks for any help.

Twey
05-02-2006, 07:50 AM
Broken link.
If you only have one slideshow on the page, see this modification (http://www.twey.co.uk/files/slide.html) of mine to another slideshow script. The buttons can be replaced with images, text, whatever you like, so long as you keep the ids and onclick events the same.

eglons
05-02-2006, 11:21 AM
Thanks for this, it's a big step forward. I've tried playing with it with a set of different sized images, if I leave the style="width:97;height:100;" in then all images are resized to this size... if I remove it, then images are left alone but the screen seems to jump. I've had a play with the imageblend function but it's too clever for me!

Any clues?

Twey
05-02-2006, 12:47 PM
Unfortunately, since the images are of different sizes, there is no way to prevent the page from jumping without specifying a maximum dimension in that width: and height: bit. The imageblend function won't help you, unless it's acceptable to you for the rest of the page to slowly slide out of the way of the new, larger image, rather than jumping suddenly.

eglons
05-02-2006, 01:03 PM
Could the controls be placed above the image, so the jumping wouldn't matter?

Twey
05-02-2006, 01:41 PM
They could. These are the controls:
<input id="prev" type="button" onclick="slideit(true);" value="Previous" />
<input id="stopstart" type="button" onclick="stopstart();" value="Start" />
<input id="next" type="button" onclick="slideit(false);" value="Next" /><br />
<input type="button" onclick="whichimage=-1;slideit(false);" value="Restart" />
<select id="selectimage"><option value="NONE">Choose an image...</option></select>
<p id="imageinfo"></p>You can put them wherever you want.