How do I fix my photoslider

See more:

CSS

HTML

jQuery

Hello,

In a school class I've learned to make a photoslider and now I want to use it for my own school project but it doesnt work... http://eduweb.hhs.nl/~11028416/html/[^]

If you click this link you will see what the problem is but I dont know how to fix this.

My code regarding to the slider...

HTML

<div id="sliderFrame">
<img class="sliderImage" src="images/rood.png">
<img class="sliderImage" src="images/subway2.png">
</div>

CSS

#sliderFrame {
width: 345px;
overflow: hidden;
}
  
.sliderImage {
position: absolute;
margin-top: 73px;
display: none;
}  

jQuery

var currentImage = 0; 

$(document).ready(function(){
	console.log("er zijn " + $(".sliderImage").length + " foto's");	
	$(".sliderImage").eq(currentImage).show(); 
	changeImage(); 
});

changeImage = function(){
	$(".sliderImage").eq(currentImage).animate({left:"-345px"}, 1000); 
	currentImage += 1;
	
	if (currentImage > 1){	
		currentImage = 0;			
	 }; 										
	
	$(".sliderImage").eq(currentImage).show().css("left", "345px").animate({left: "0px"}, 1000); 
	setTimeout("changeImage()", 3000); 
}

I've spent a few hours now and its giving me headache haha.

Thanks in advance

Sincerely

Job