[joanzn]

I'm trying to have 3 images cycle for a convertible car. I am trying to use setInterval to start with the 1st image(top-down) and go through to the 2nd (top-going-up) to the 3rd(top-up) then back to the 2nd then back to the 1st. so the sequence is 1,2,3,2,1,2,3,2,1 continuously. the html is simple enough:

<div class="car">
			<img src="img/1.jpg">
			<img src="img/2.jpg">
			<img src="img/3.jpg">
		</div>

the script is:

var count = 1,
					maxIndex = 2;
										
				 setInterval(function(){
					// check if last vehicle image is visible
					if (count == 0) {
						$('.car').children('img').eq(maxIndex).fadeTo(1500, 0, function() { $(this).hide(); });
					}			
					else {
					
						$('.car').children('img').eq(count)
							.fadeTo(0, 0)
							.show()
							.fadeTo(1500, 1, function() {
								if (count > 1) {
									$('.car').children('img').eq(count-1).fadeTo(0, 0).hide();
								}
							});  
					}
					count = (count >= maxIndex) ? 0 : count+1;
				}, 3000);

I've kinda been stuck on this for a couple days now and I thought this would be simple! Any help is much appreciated. If I find a solution I'll be sure to post it in here for anyone in the future