Ultimate Fade-in slideshow (v2.4) Go to first

[mentha]

I have multiple slideshows on my page, which I show/hide depending on the selected gallery title. So far, so good, but...

I'd like the hidden slideshows to return to the first image, so when the visitor views slideshow A, then slideshow B and then goes back to slideshow A, they see the first image in slideshow A and not the one they saw last before viewing slideshow B.
(I hope I make sense here, haha!)

I just can't seem to grasp how to do this... :confused: Here's a link, so you can see how I've implemented the slideshows. In the page source, you can also see the script used to show/hide the different slideshows.

http://www.studio-le-bb.com/2011/fotografie.html

I do hope someone can help me with this. Thanks in advance!!!

Whoops! I just realized I put this thread in the wrong subforum... Sorry about that! If the mods could move it, I'd be much obliged :)

[jscheuer1]

The browser cache may need to be cleared and/or the page refreshed to see changes.

In your showHide function, add the highlighted:


<script type="text/javascript">
function showHide(id) {
window['slideshow' + id].navigate(0);
var el = document.getElementsByClassName('slider');
var L , i=0;
while(L = el[i++]) {
L.style.display=(L.getAttribute('id') == 'div-'+id) ? "block" : "none";
}
var el2 = document.getElementsByTagName('li');
var M , u=0;
while(M = el2[u++]) {
M.className=(M.getAttribute('id') == 'a-'+id) ? "active" : "";
}
}
</script>

Or, since you're using jQuery, replace it with this one:


<script type="text/javascript">
function showHide(id) {
window['slideshow' + id].navigate(0);
var $ = jQuery;
$('.slider').hide().filter('#div-' + id).show();
$('li').removeClass('active').filter('#a-' + id).addClass('active');
}
</script>

That way it will work in IE 8 and less. (IE 8 and less do not support document.getElementsByClassName)

Or even:


<script type="text/javascript">
function showHide(id) {
var $ = jQuery;
$('.slider').each(function(i){
window['slideshow' + (i + 1)].navigate(0);
}).hide().filter('#div-' + id).show();
$('li').removeClass('active').filter('#a-' + id).addClass('active');
}
</script>

which will not show a 'ghost' transition as you switch slideshows when the one being switched to is not already at the 0 position.

BTW, if you want the captions to show up at the beginning of the slide fade in instead of after, I have a script for that, let me know.