jQuery Forum

<script type="text/javascript" src="jquery-1.2.6.min.js"></script>

<script type="text/javascript">

/*** 

    Simple jQuery Slideshow Script

    Released by Jon Raasch (jonraasch.com) under FreeBSD license: free to use or modify, not responsible for anything, etc.  Please link out to me if you like it :)

***/

function slideSwitch() {

    var $active = $('#slideshow IMG.active');

    if ( $active.length == 0 ) $active = $('#slideshow IMG:last');

    // use this to pull the images in the order they appear in the markup

    var $next =  $active.next().length ? $active.next()

        : $('#slideshow IMG:first');

    // uncomment the 3 lines below to pull the images in random order

    

    // var $sibs  = $active.siblings();

    // var rndNum = Math.floor(Math.random() * $sibs.length );

    // var $next  = $( $sibs[ rndNum ] );

    $active.addClass('last-active');

    $next.css({opacity: 0.0})

        .addClass('active')

        .animate({opacity: 1.0}, 1000, function() {

            $active.removeClass('active last-active');

        });

}

$(function() {

    setInterval( "slideSwitch()", 5000 );

});

</script>

<style type="text/css">

/*** set the width and height to match your images **/

#slideshow {

    position:relative;

    height:350px;

}

#slideshow IMG {

    position:absolute;

    top:0;

    left:0;

    z-index:8;

    opacity:0.0;

}

#slideshow IMG.active {

    z-index:10;

    opacity:1.0;

}

#slideshow IMG.last-active {

    z-index:9;

}

</style>

<div id="slideshow">

    <a href="http://www.ehealthforyou.com" target="_blank"><img src="images/ehealthforyousite.png" width="600" height="300" alt="E Health For You" title="E Health For You" class="active" /></a>

    <a href="http://www.partywithsid.co.uk" target="_blank"><img src="images/partywithsidsite.png" width="600" height="300" alt="Party With Sid" title="Party With Sid" /></a>

    <a href="http://www.bellybusterfitness.co.uk" target="_blank"><img src="images/bellybusterfitnesssite.png" width="600" height="300" alt="Belly Buster Fitness" title="Belly Buster Fitness"/></a>

    <a href="http://www.musclemerchants.com" target="_blank"><img src="images/musclemerchantssite.png" width="600" height="300" alt="Muscle Merchants" title="Muscle Merchants"/></a>

    <a href="http://www.fazecaterers.co.uk" target="_blank"><img src="images/fazecatererssite.png" alt="Faze Caterers" title="Faze Caterers" width="600" height="300" /></a>

    <a href="http://www.martsblinds.co.uk" target="_blank"><img src="images/martsblindssite.png" alt="Marts Blinds" title="Marts Blinds" width="600" height="300" /></a>

    <a href="http://www.malimaf.com" target="_blank"><img src="images/malimafsite.png" alt="Malimaf" title="Malimaf" width="600" height="300" /></a>

    <a href="http://www.cazclub.co.uk" target="_blank"><img src="images/cazclubscreenshot.png" alt="Caz Club" title="Caz Club" width="600" height="300" /></a>

    <a href="http://www.greenoakroofing-windows.co.uk" target="_blank"><img src="images/greenoakroofingsite.png" alt="Greenoak Roofing" title="Greenoak Roofing" width="600" height="300" /></a>

    <a href="http://www.mdmminibusandcars.co.uk" target="_blank"><img src="images/mdmminibussite.jpg" alt="MDM Minibus and Cars" title="MDM Minibus and Cars" width="600" height="300" /></a>

    <a href="http://www.dressingup4fun.com" target="_blank"><img src="images/dressingupforfunsite.jpg" alt="Dressing Up For Fun" title="Dressing Up For Fun" width="600" height="300" /></a>

    <a href="http://www.widdlegifts.com" target="_blank"><img src="images/widdlegiftssite.jpg" alt="Widdle Gifts" title="Widdle Gifts" width="600" height="300" /></a>

    <a href="http://www.macs-golf.co.uk" target="_blank"><img src="images/macsgolfsite.jpg" alt="Macs Golf" title="Macs Golf" width="600" height="300" /></a>

    <a href="http://www.regangroup.co.uk" target="_blank"><img src="images/regangroupsite.png" alt="Regan Group" title="Regan Group" width="600" height="300" /></a>

    <a href="http://www.pmfencing.co.uk" target="_blank"><img src="images/pm-fencing-screenshot.jpg" alt="PM Fencing" title="PM Fencing" width="600" height="300" /></a>

    <a href="http://www.tippytoestoys.co.uk" target="_blank"><img src="images/tippytoestoyssite.gif" alt="Tippy Toes Toys" title="Tippy Toes Toys" width="600" height="300" /></a>

<a href="http://www.vzcleaningservices.co.uk" target="_blank"><img src="images/vzcleaningsite.jpg" alt="VZ Cleaning" title="VZ Cleaning" width="600" height="300" /></a>

</div>