PDA

View Full Version : Swiss Army or Ultimate Fade-in mod



tipo1000
02-09-2008, 07:52 AM
I tried "Swiss Army slideshow" and "Ultimate Fade-in" and was able to get both to load different set of images depending on user input. The use: user clicks on one of the many products on the page and corresponding slideshow starts to run.

Problem remains with both slideshows that response is not immediate. With "Swiss Army" user have to wait until next slide comes up to see image corresponding the product he clicked. With "Ultimate" the updated image is the one after next.

Question: Is there a way to have slideshow with immediate response?

Both slideshows are absolutely great! Just that 'small' piece I need is missing. Like so many times before..

Thanks, Timo@San Diego

jscheuer1
02-09-2008, 04:57 PM
Sounds like you have already modified the code a bit, perhaps quite a bit:

Please post a link to the page on your site that contains the problematic code so we can check it out.

tipo1000
02-09-2008, 11:32 PM
Here it is: http://www.timoparru.com/test.html
If you click the first thumbnail on middle row, it loads new pics to slideshow.
/timo

jscheuer1
02-10-2008, 02:49 AM
I see, you are changing the array of preloaded images for an array of what appear to be non-preloaded images. One of the features of UFade is that you can have multiple slide shows on a page. What I would do is to have one for each show I wanted, for example with three shows (set up the separate arrays in the main script as instructed on the demo page):


<td style="width: 346px; height: 116px; text-align: center;" colspan="1" rowspan="3">
<div id="show1">
<script type="text/javascript">
new fadeshow(fadeimages, 340, 350, 0, 3000)
</script>

</div>
<div id="show2" style="display:none;">
<script type="text/javascript">
new fadeshow(fadeimages2, 340, 350, 0, 3000)
</script>

</div>
<div id="show3" style="display:none;">
<script type="text/javascript">
new fadeshow(fadeimages3, 340, 350, 0, 3000)
</script>

</div>
</td>

Then, say you wanted to switch to show2 from either 3 or 1:


<img style="width: 65px; height: 110px;" alt=""
onclick="document.getElementById('show1').style.display=
document.getElementById('show3').style.display='none';
document.getElementById('show2').style.display='block';" src="104-03_65x110.jpg">