Rate this script:  I Love it  /   I Hate it

Miniature slideshow for DIVs using Scriptaculous


Code

<div id="slideshow1" class="slide"><div>frame 1</div></div>
<div id="slideshow2" class="slide" style="display: none"><div>frame 2</div></div>
<div id="slideshow3" class="slide" style="display: none"><div>frame 3</div></div>
<div id="slideshow4" class="slide" style="display: none"><div>frame 4</div></div>

<script type="text/javascript">
   
    start_slideshow(1, 4, 2000);
   
    function start_slideshow(start_frame, end_frame, delay) {
        setTimeout(switch_slides(start_frame,start_frame,end_frame, delay), delay);
    }
                           
    function switch_slides(frame, start_frame, end_frame, delay) {
        return (function() {
            Effect.Fade('slideshow' + frame);
            if (frame == end_frame) { frame = start_frame; } else { frame = frame + 1; }
            setTimeout("Effect.Appear('slideshow" + frame + "');", 850);
            setTimeout(switch_slides(frame, start_frame, end_frame, delay), delay + 850);
        })
    }

</script>

 

 
Miniature slideshow for DIVs using Scriptaculous scripts | Miniature slideshow for DIVs using Scriptaculous snippet | Miniature slideshow for DIVs using Scriptaculous example | Miniature slideshow for DIVs using Scriptaculous tutorial | Miniature slideshow for DIVs using Scriptaculous code