I have trying for some time. And I gave a look at the image slider questions already. But I would really appreciate if I get some specific help here. Please tell me where the following code went wrong.

Here's my jQuery code:

Code:
function slideMe {
$('.imgcontainer').animate({"margin-left":"-= 100%"}, 2000, function () {
  if($('.imgcontainer').css("margin-left") == (-300%)) {
    $('.imgcontainer').css("margin-left", "0px");
  }
 slideMe();
});

} window.onload = slideMe();
And here's the script on HTML page:
Code:
<div class="fitimage">
<div class="imgcontainer">
<img src="img/copywrtng.jpg" class="headerimage" alt="copywriting" />
<img src="img/copywrtng1.jpg" class="headerimage" alt="copywriting" />
<img src="img/copywrtng2.jpg" class="headerimage" alt="copywriting" />
</div>
</div>
And here's what I have on CSS:

Code:
div.fitimage {
width:100%;
height:93vh;
overflow: hidden;
}
img.headerimage {
padding: 0;
margin:0 auto;
width:100%;
/*max-height:100%;
max-width:100%;*/
height:93vh;
}
My logic is that as each image takes up 100% width, as the ".imgcontainer" div slides left with margin-left: -100%, each image should come up one by one from the right, until it reaches the last one when it reverts to the first image again.

It's not working!

Please help.