How can I automate this code for a slideshow?

Question

I recently did this tutorial: http://fearlessflyer.com/2010/08/how-to-create-your-own-jquery-content-slider/ and I was wondering if anyone knows how I can use the code in this tutorial but change it to automatically scroll through the images instead of scrolling through when clicking on the text.

the code that scrolls the images after checking the mouse "click" event is:

$(theImage).each(       
function(intIndex){             
$(this).nextAll('a')
.bind("click", function(){
    if($(this).is(".next")) {
        $(this).parent('li').parent('ul').animate({
            "margin-left": (-(intIndex + 1) * theWidth)             
                }, 1000)    
        } else if($(this).is(".previous")){
        $(this).parent('li').parent('ul').animate({
            "margin-left": (-(intIndex - 1) * theWidth)             
        }, 1000)    
        } else if($(this).is(".startover")){
        $(this).parent('li').parent('ul').animate({
            "margin-left": (0)              
        }, 1000)
}
});//close .bind()                                   
});//close .each()

the statement:

.bind("click", function(){...

checks for a mouse "click" event and then executes the if statement. I would like to instead just run the if statement without first having to click. Any help would be greatly appreciated, thanks.

Answer 1

<script language="JavaScript" type="text/javascript">  
var images = new Array('morning.jpg','afternoon.jpg','night.jpg','lightbulb_on.jpg')  
var count = -1  

function slideShow(){    

 if (count <=2){    
  count ++;  
 }  

  document.getElementById("show").innerHTML = "<img src="images/"+images[count]+"">"  
  setTimeout("slideShow()", 3000)    
}    
</script>  
<div id="show">  
<script>slideShow()</script>  
</div>  

That one works with the click event, so you have to change the way it works, setting timers. I usually do it with this code. Hope it helps. I dont put the comment because I cant (low reputation) sorry