Rotate images in image control

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



<div id="slider" style="width:200px;">

    <p>jQuery Slide show</p>

    <img id="img1" src="../images/aspnet4.gif" />

</div>

<script language="javascript" type="text/javascript">

var interval = 3000; // Line 1: time interval after which next image will load



var images = ['../images/aspnet4.gif', '../images/aspnet4css.gif', '../images/jquerycourse.gif']; // Line 2



var i = 1; // Line 3: default index of the image from the array that will be shown by default



setInterval(ChangeImages, interval); // Line 4: timer that will run after every interval



// function that will change the images

function ChangeImages() {

    if (i == images.length) { i = 0; }


    $("#img1").slideUp('slow', function () {$(this).attr('src', images[i]); i++; }).slideDown('slow');

}

</script>